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Zend Framework 2 is the latest update to the well-known Zend Framework. This version 
has considerably eased the process of building complex web applications with minimal 
development effort using plug and play components. Zend Framework 2 also provides a 
highly robust and scalable framework for developing web applications. 





This book will guide you through the process of developing powerful web applications using 
ZF2. It covers all aspects of Zend Framework application development right from installation 
and configuration; the tasks are designed in a way that readers can easily understand and 
use them to build their own applications with ease. 


This book begins with basic installation and configuration of the Zend Framework. As you 
progress through the exercises, you will become thoroughly acquainted with ZF2. With 
this book, you will learn about the basic concepts of building solid MVC web applications 
using Zend Framework 2. The detailed step-by-step instructions will enable you to build 
functionality such as a group chat, a file and media sharing service, search, and a simple 
store, to name a few. You will also use a wide range of external modules to implement 
features that are not natively available. 


By the end of the book, you will be well versed in building complex and functionality-rich 
web applications using Zend Framework 2. 


Chapter 1, Getting Started with Zend Framework 2.0, introduces you to the configuration of 
the development environment. In this chapter, we will set up a PHP application server, install 
MySQL, and create a development database which will be used in subsequent chapters for 
our Zend Framework learning exercises. 
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Chapter 2, Building Your First Zend Framework Application, explains the creation of the Zend 
Framework 2 project; we will be reviewing some of the key aspects of building a ZF2 MVC 
application by creating modules, controllers, and views. We will be creating our own custom 
module in Zend Framework which will be enhanced further in subsequent chapters of 

this book. 


Chapter 3, Creating a Communication Application, introduces you to Zend\Form. In this 
chapter we will create our first registration form, and set up login and authentication for 
registered users using Zend Framework components. 


Chapter 4, Data Management and Document Sharing, covers some of Zend Framework's 
data and file management concepts. In this chapter, we will learn various aspects of Zend 
Framework including ServiceManager, the TableGateway pattern, handling uploads, and 
file sharing. 


Chapter 5, Chat and E-mail, covers the use of JavaScript in your application. This chapter uses 
a simple group chat implementation as an example for explaining the usage of JavaScript in 
your applications; you will also be introduced to sending e-mails using Zend\Mail and the ZF2 
event manager. 


Chapter 6, Media Sharing, explains the management and sharing of images and videos using 
Zend Framework. In this chapter, we will use of various external Zend Framework 2 modules 
to work with images and videos. 


Chapter 7, Search using Lucene, introduces you to the Lucene search implementation 
using Zend Framework. This chapter begins by explaining the users about the installation 
of ZendSearch\Lucene module, we then cover the details of implementing search for 
database records and also document files. 


Chapter 8, Creating a Simple Store, introduces you to e-commerce. In this chapter, we will 
be building a simple online store to demonstrate the process involved in development of 
a shopping cart. We will be using PayPal Express Checkout as our payment processer in 
this chapter. 


Chapter 9, HTML5 Support, introduces you to HTMLS5 support in Zend Framework 2. When 
compared to the previous version, ZF2 offers exhaustive support for various HTML5 features; 
this chapter covers two major aspects of ZF2's HTML5 support—new input types and 
multiple file uploads. 


Chapter 10, Building Mobile Applications, introduces you to the development of native 
mobile applications with the help of Zend Framework 2 and Zend Studio 10. In this chapter, 
we will learn the fundamentals of building cloud-connected mobile applications using Zend 
Framework; we will also learn about the setup of Zend PHP developer cloud environment. 
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What you need for this book 


You will need a system that is capable of running Zend Server CE along with MySQL. 
The prerequisite software that is required for working with tasks to be performance 
in the book is covered in Chapter 1, Getting Started with Zend Framework 2.0. 


If you are a PHP developer who is new to Zend Framework, but you want to get hands-on with 
the product quickly, this book is for you. Basic knowledge of object-oriented programming with 
PHP is expected. 


In this book, you will find several headings appearing frequently. 


To give clear instructions of how to complete a procedure or task, we use: 


Time for action —heading 


1. Action 1 
2. Action2 
3. Action3 


Instructions often need some extra explanation so that they make sense, so they are 
followed with: 


What just happened? 


This heading explains the working of tasks or instructions that you have just completed. 


You will also find some other learning aids in the book, including: 


These are short multiple-choice questions intended to help you test your own understanding. 
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These practical challenges give you ideas for experimenting with what you have learned. 


You will also find a number of styles of text that distinguish between different kinds of 
information. Here are some examples of these styles, and an explanation of their meaning. 


Code words in text are shown as follows: "The TableGateway class extends 
AbstractTableGateway which implements TableGatewaylInterface." 


A block of code is set as follows: 


// Add Document to index 

SindexDoc = new Lucene\Document () ; 
SindexDoc->saddField(Slabel) ; 
SindexDoc->addField(Sowner) ; 
SindexDoc->saddField(S$fileUploadId) ; 
Sindex->addDocument (S$indexDoc) ; 


} 


// Commit Index 
Sindex->commit () ; 


When we wish to draw your attention to a particular part of a code block, the relevant lines 
or items are set in bold: 


// Add Document to index 

SindexDoc = new Lucene\Document () ; 
SindexDoc->saddField(Slabel) ; 
SindexDoc->addField(Sowner) ; 
SindexDoc->saddField($S$fileUploadId) ; 
Sindex->addDocument ($indexDoc) ; 


} 


// Commit Index 
Sindex->commit () ; 


Any command-line input or output is written as follows: 

$ sudo apt-get install php5-cli 

$ sudo apt-get install git 

$ curl -s https://getcomposer.org/installer | php 

New terms and important words are shown in bold. Words that you see on the screen, in 


menus or dialog boxes for example, appear in the text like this: "On the Select Destination 
Location screen, click on Next to accept the default destination." 
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| Warnings or important notes appear in a box like this. | 


| Q Tips and tricks appear like this. | 


Feedback from our readers is always welcome. Let us know what you think about this 
| book—what you liked or may have disliked. Reader feedback is important for us to 
develop titles that you really get the most out of. 


To send us general feedback, simply send an e-mail to feedback@packtpub.com, and 
mention the book title through the subject of your message. 


If there is a topic that you have expertise in and you are interested in either writing or 
contributing to a book, see our author guide on www. packtpub.com/authors. 


Now that you are the proud owner of a Packt book, we have a number of things to help you 
to get the most from your purchase. 


You can download the example code files for all Packt books you have purchased from 
your account at http: //www. packtpub.com. If you purchased this book elsewhere, 
you can visit http: //www.packtpub.com/support and register to have the files 
e-mailed directly to you. 
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Although we have taken every care to ensure the accuracy of our content, mistakes do 
happen. If you find a mistake in one of our books—maybe a mistake in the text or the 
code—we would be grateful if you would report this to us. By doing so, you can save other 
readers from frustration and help us improve subsequent versions of this book. If you find 
any errata, please report them by visiting http: //www. packtpub.com/submit-errata, 
selecting your book, clicking on the errata submission form link, and entering the details of 
your errata. Once your errata are verified, your submission will be accepted and the errata 
will be uploaded to our website, or added to any list of existing errata, under the Errata 
section of that title. 


Piracy 


Piracy of copyright material on the Internet is an ongoing problem across all media. At Packt, 
we take the protection of our copyright and licenses very seriously. If you come across any 
illegal copies of our works, in any form, on the Internet, please provide us with the location 
address or website name immediately so that we can pursue a remedy. 


Please contact us at copyright @packtpub.com with a link to the suspected pirated material. 


We appreciate your help in protecting our authors, and our ability to bring you valuable content. 


You can contact us at questions@packt pub. com if you are having a problem with any 
aspect of the book, and we will do our best to address it. 
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Getting Started with 
Zend Framework 2.0 





In this chapter we will get our development environment set up and configured 
in order to start development with Zend Framework 2.0. We will set up a PHP 
Application Server, install MySQL, and create a development database that will 
be used in subsequent chapters for our Zend Framework learning exercises. So, 
let's get started. 





Zend Framework 2.0 


The last major release of Zend Framework, which happened in 2007, was version 1.0; 
during the last five years, Zend Framework has undergone a lot of changes to be a 
successful PHP-based framework. But by merely updating the framework, Zend Framework 
has retained some of the issues that were inherently present in Zend Framework 1.0. 


Zend Framework 2.0 is an attempt to make Zend Framework better by rearchitecting the 
framework right from the core. Some of the key features of Zend Framework 2.0 over its 
previous version are listed as follows: 


+ 


+ 
+ 
+ 


PHP 5.3 features such as namespaces and closures 
A modular application architecture 
Event manager 


Dependency Injection (DI) 


We will get to know about implementing the new features of Zend Framework 2.0 in the 
coming chapters. 


Getting Started with Zend Framework 2.0 


In this chapter we will cover the installation and configuration of some of the prerequisites 
of Zend Framework 2.0. ZF2 can be installed on most PHP-enabled web servers that support 
PHP 5.3.3 or later. 


We have used Zend Server Community Edition as our default web server; however, any other 
PHP stack that supports PHP 5.3.3 can be used. Alternatively, you can also download Apache 
and PHP separately and install PHP over Apache. 


To simplify the installation process, | am using Linux as the primary development 
environment in this book. All the tools used in this book are available for Windows 
and can be used to perform the same activity. 


Introduction to Zend Server Community Edition (CE) 


Zend Server Community Edition is the free version of the popular Zend Server stack. The 
Zend Server stack provides a pre-integrated PHP application stack that could be used across 
development, testing, and production. This enables application development teams to have 
a consistent environment across all stages of development. 


Zend Server CE also provides features such as Zend Optimizer+ for PHP bytecode caching and 
Zend Guard for encoding files. 


Zend Server CE — system requirements 


Zend Server offers installers for Windows, Mac OS X, and a universal installation package 
compatible with most Linux distributions. 


More details on the installation requirements can be found at http: //www. zend.com/en/ 
products/server/system-requirements. 


Time for action — installing Zend Server CE 





Our next step will be to download and install Zend Server CE; |am running Ubuntu 12.04 
Precise Pangolin. The installation procedure for other operating systems could be different; 
you can always refer to the Zend Server website for installation instructions. The following 
are the steps to install the Zend Server CE: 


1. Visit the Zend Server Community Edition website (http: //www.zend.com/en/ 
community/zend-server-ce) and download the latest version of Zend Server 
that is applicable to your operating system. In this case, we will be downloading the 
Linux installer. 
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2. Once the installer is downloaded, extract the contents of the installer to a 
temporary location: 


$ tar -zxvf ZendServer-5.6.0-RepositoryInstaller-linux.tar.gz 


3. After extracting, the installer needs to be started with administrator privileges: 
$ cd ZendServer-RepositoryInstaller-linux/ 


$ sudo ./install zs.sh 5.3 ce 


_ Weare passing two parameters to the installer. The first one is the version of 
EIN PHP that needs to be installed; in this case it is 5.3. The second parameter 
identifies the edition of Zend Server that needs to be installed; in this case it 

is ce for Community Edition. 


4. During the installation, the installer will request you to download various packages: 


krishnav@ubuntu: ~/Downloads/ZendServer-Repositoryinstaller-linux 


krishnav@ubuntu:~/Downloads/ZendServer -RepositoryInstaller-linux$ sudo ./install_zs.sh 5.3 ce 


Running this script will perform the following: 
* Configure your package manager to use Zend Server repository 
* Install Zend Server on your system using your package manager 


Hit ENTER to install Zend Server, or Ctrl+C to abort now. 





5. Zend Server will be installed into /usr/local/zend by default; the default 
document root will point to /var/www. You can use the following files to make 
configuration changes to the Zend Server instance: 


a Apache master configuration is available in /etc/apache2/apache2. 
conf 


a PHP configuration is controlled by /var/local/zend/etc/php.ini 
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The following screenshot shows the installed location of Zend Server: 


> jad include a 
> E lib 
v i local 
> ja bin 
> iad etc 
> im Games 
> Æ include 
> im lib 
> ii man 
> Æ sbin 
> Æ share 
> jd src 


usr local zend Q, Search 


> ja bin 
> ja doc 
> ia etc 
> ja gui 
> Æ include 
> |g lib 
> gd share 
> Æ tmp 
> E var 
> E sbin 





6. Once the installation is completed, you should be able to open http://localhost 
on your web browser. This should take you to a test page like the one shown in the 
following screenshot: 


Mozilla Firefox 


(i http://localhost/ 
http://localhost/ Q A 


@ Mozilla Firefox is free and open source software from the non-profit Mozilla Foundation. | Know your rights...| % 














It works! 


This is the default web page for this server. 


The web server software is running but no content has been added, yet. 





~ To restart Zend Server, use the $ sudo service 
zend-server restart command. 
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What just happened? 


Zend Server CE is installed and ready to be used. Now we have a web server and a 
compatible version of PHP running—this satisfies the core requirements for running 
Zend Framework 2.0. 





We will be using Git to check out Zend Framework from Github; one of the major changes that 
happened to Zend Framework 2.0 is that the source control has changed from SVN to Git. 


Your next task will be to install Git. We will be making use of Git when we are setting up our 
Zend Framework project. 


Git binaries can either be downloaded from http: //www.git-scm.com/ 


K or installed from your operating system's repositories. 
Q Installation instructions for Git can be found at the following link: 


http: //git-scm.com/book/en/Getting-Started- 
Installing-Git 


Our next step will be to set up Zend Server CE and make some configuration changes that 
will enable us to run other PHP applications. 


Zend Server CE's Administration Interface is a web-based user interface that provides the 
following features: 

Managing PHP extensions 

Configuring PHP directives 


Managing Zend Server components 


©% ¢ ©% o 


Monitoring PHP status, extension status, and application/server logs 


In our next task, we will be making a configuration change to Zend Server by using its 
Administration Interface. 
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Time for action — configuring Zend Server CE 


The Zend Server needs to be configured after the installation is completed. The following are 
the steps for configuring Zend Server CE: 





1. Open the admin console of Zend Server in your default browser 
(http: //localhost:10081/). 


A The Zend Server UI console runs on port 10081 while the web server 
Q runs on port 80. This is why we need to implicitly specify the port 
number in the URL for accessing the UI console. 


2. When opening the Zend Server Administration Interface for the first time, you 
will be presented with a configuration wizard. Review and accept the terms and 
conditions of Zend's End User License Agreement page: 


Zend Server Community Edition - Mozilla Firefox 


(_} Zend Server Community Edition 
© |{ localhost Q A 


@ Mozilla Firefox is free and open source software from the non-profit Mozilla Foundation. Know your rights...| 


server Community Edition 


Step 1 of 3 : End User License Agreement 


Please read and accept the following terms before using Zend Server Community Edition: 


Zend Technologies Ltd. 

End-User License Agreement 

This End-User License Agreement (this "Agreement’) is a legal contract between 
you, as either an individual or a single business entity, and Zend Technologies 
Ltd. and its affiliates ("Zend"). 


READ THE TERMS AND CONDITIONS OF THIS AGREEMENT CAREFULLY 
BEFORE DOWNLOADING OR INSTALLING ZEND'S PROPRIETARY 
SOFTWARE (THE “SOFTWARE”) OR OBTAINING A LICENSE KEY TO THE 
SOFTWARE OR USING THE SOFTWARE. THE SOFTWARE IS FURTHER 
DEFINED IN AN ORDER DOCUMENT (AN "ORDER"), ENTERED INTO 
BETWEEN YOU AND ZEND OR YOU AND AZEND RESELLER, WHICH SETS 
FORTH COMMERCIAL TERMS APPLICABLE TO YOUR PURCHASE OF THE 
SOFTWARE. 


_| | have read and agree to the end user license agreement terms 
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3. As shown in the following screenshot, you will be asked to set the password for the 
Zend Server installation: 


Zend Server Community Edition - Mozilla Firefox 


{i Zend Server Community Edition 
© | © localhost 


ae 


@ Mozilla Firefox is free and open source software from the non-profit Mozilla Foundation. Know your rights...| % 
server 








Step 2 of 3 : Set Password 





Enter Password 


eeorceee 





Retype Password ooo 





This password is required in order to access the Zend Server Administration Interface. To further secure Zend Server, please refer to the User Guide section on Securing 
the Administration Interface 





4, After the initial configuration wizard is completed, you will be redirected to the Zend 
Server Administration Interface's home page. 


Zend Server Community Edition - Mozilla Firefox 


{C} Zend Server Community Edition 
© | £2 locathost:10081 


Server com Help | About | Logout 


elt Monitor & Applications Rule Management 


“A Server Setup & Administration 
Dashboard | Events | Jobs | 


Code Tracing | Serverinfo | PHP Info | Logs 


Tasks System Overview 
View PHPinfo page 


PHP Version 5.3.14 
Load or Unload PHP Extensions 


Zend Framework Version 1.12.0 
Configure Zend Server Components 


more » 
Change PHP directive Values 


Zend Server Community Edition 


Learn how to start with Zend Server and PHP 


Zend Data Cache 
Zend Debugger 
Zend Guard Loader 
Zend Java Bridge 
Zend Optimizer+ 


more » 





© Restart PHP 74 
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5. We need to set the session save path. In order to do this, perform the 
following steps: 


1. Navigate to Directives in Server Setup. 

2. Search for session.save path. 

3. Set the value to /tmp. 

4. Click on Save Changes and then Restart PHP. 


Zend Server Community Edition - Mozilla Firefox 
{i Zend Server Community Edition 
© | £ localhost 


Help | About | Logout 


elè Monitor [È] Rule Management “ Server Setup & Administration 
Components | Extensions | Directives | Debugger 
View: Popular | All | session.save_ path | Save Changes 


E 


session.save_path - Argument which is passed to the save handler 





Ù Restart PHP Fa 


What just happened? 


We have successfully modified a server configuration using Zend Server's Administration 
Interface and we have restarted the PHP instance running on Zend Server. 


MySQL 


MySQL doesn't need an introduction—it is the world's most widely used open source database 
application. It's free and is available on the Internet to individuals and businesses that wish to 
develop their websites and applications using the MySQL database. 


Zend Framework 2.0 has driver support for MySQL along with SQLite, PostgreSQL, and 
Microsoft SQL Server. 


Our next exercise will be to install MySQL on our development machine. MySQL is available 
for download from all Linux repositories. Windows and Mac users will have to download the 
installer from the MySQL website (http: //dev .mysql .com/downloads/). 


[14] 


Chapter 1 


I Windows and Mac users can skip this section if they have chosen to install 
È MySQL Server as a part of their Zend Server CE installation. The Zend Server 
Q installer allows Windows and Mac users to download and install MySQL 
Server as a part of the installation. 


Time for action — installing MySQL 





MySQL Server and Client need to be installed using the following steps; we will be using 
MySQL as our primary database in this book: 


1. ina standard Ubuntu installation, MySQL can be installed by executing the following 
command in the shell prompt: 


$ sudo apt-get install mysql-server mysql-client 


2. After the installation is complete, MySQL Server will start automatically. To check if 
MySQL Server is running, run the following command: 


$ sudo netstat -tap | grep mysql 
3. The command should give an output that is similar to the following; this means that 
the MySQL daemon is running: 
tcp 0 0 localhost:mysql kk LISTEN 923/mysqlid 
4. If, for some reason, MySQL Server is not running, you can start the server by running 
the restart command: 


$ sudo service mysql restart 


What just happened? 


We have just installed MySQL; we have the LAMP stack ready too. Our next step will be to 
create a database in MySQL Server. 


package. If you are using a stack that doesn't have MySQL support enabled 


> Since we are using Zend Server, we don't need to install the php5-mysql 
. by default, you will have to install the necessary packages manually. 
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Having gone through this section, feel free to attempt the task in the following section. 


phpMyAdmin 


phpMyAdmin is a free, open source web-based database administration tool written in PHP. 
phpMyAdmin provides a web-based UI to manage MySQL Database Server; add / remove / 
manage databases, users, privileges; and so on. In this book, we will be using phoMyAdmin 
as the database Administration Interface for managing our database(s). 


Now that we have Apache, PHP, and MySQL installed, our next step will be to create a blank 
database in MySQL Server. 


For doing this, we need to install and configure phoMyAdmin in the Zend Server. 


phpMyAdmin can either be downloaded from http://www. phpmyadmin. 
vi net/ or installed from your operating system's repositories. 


Q Installation instructions for phpMyAdmin can be found at the following link: 


http://docs.phpmyadmin.net/en/latest/setup.html 


In our next task we will be creating a MySQL database, creating users in the MySQL 
server and also grant them access permissions to connect to the database and perform 
database operations. 


Time for action — creating a database 





To create a new database, open an instance of phpMyAdmin in your web browser and follow 
the steps described here: 


1. Open phpMyAdmin in your web browser by visiting http: //localhost/ 
phpmyadmin: 
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localhost / localhost | phpMyAdmin 3.4.10.1deb1 - Mozilla Firefox 
á localhost / localhost | phpMyA... 


Sá localhost/p hpmyedm! n/i ndex.php?token=6818D93cbD718b73b98aad86318574c90& 2 J : Q A 


phpMyAdmin 


4) Databases L] soL i, Status 42 Processes =| Privileges |3 Export v More 





2 goe 
| information_schema 


| mysql ® change password e Server: Localhost via UNIX socket 


e Server version: 
5.5.24-Oubuntu0.12.04.1 


Protocol version: 10 


| performance_schema = MySQL connection collation  :| utf8_general_ci 


| phpmyadmin 








i) test = n ; User: root@localhost | 
l [ MySQL charset: UTF-8 Unicode (utf8) 





& Language » :| English -s 


@ Theme /Style:| pmahomme x| 


e Font size: | 82% >| e Apache/2.2.22 (Ubuntu) 
e MySQL client version: 5.0.51a 
P More settings e PHP extension: mysqli @ 














èe Version information: 3.4.10.1deb1 
Documentation 
Wiki 
Official Homepage 





Contribute 








2. Choose Databases, enter the name of the new database as zf_app in Create new 
database, and click on Create: 


localhost / localhost | phpMyAdmin 3.4.10.1deb1 - Mozilla Firefox 
2, localhost / localhost | phpMyA... 


= S localhost/php my admin/index -ph p?token=6818D93cD718b73bD98aad86318574c90 &p pN T oale Q A 


E | 


j Databases |) SQL i, Status 42 Processes =) Privileges |: Export v More 





@ RZ 


information_schema D ata b ases 
mysql 


performance schema 
~ 6 Create new database o 
| phpmyadmin 
zF_app Collation 
test s mailin 





Database . 

information_schema 5:| Check Privileges 

mysql == Check Privileges 
| performance schema a] Check Privileges 

phpmyadmin == Check Privileges 

test ==) Check Privileges 


Total: 5 


t Check All / Uncheck All With selected: El Drop 





ih Enable Statistics 


A, Note: Enabling the database statistics here might cause heavy traffic between the web server and the 
MySQL server. 
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3. After creating the database, create a database user for this database; this can be 
done by selecting Add a new user from Privileges. Provide the following details: 


User field Value 

User name zf user 
Host localhost 
Password zf pass 


After doing this you will get the following screen: 


localhost / localhost | phpMyAdmin 3.4.10.1deb1 - Mozilla Firefox 
i, localhost / localhost | phpMyA... B 


€ | @ localhost 


phpMyAdmin 
Add a new User 


2 @ z Ou) ç 


information_schema Login Information 
mysql 
performance_schema User name: | Use text field: x| 


zí user 
phpmyadmin 


test iii You have added a new user. 
zf_app i 
Password: 


Re-type: 


Database for user 


® None 
Create database with same name and grant all privileges 
>` Grant all privileges on wildcard name (username\_%) 


Create User 








4. After the user is created, go to the Privileges section and choose Edit Privileges for 
the zf_ user. 


5. 


In the Database-specific privileges section, select the zf_app database. 
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6. You will be redirected to the privileges section of the z£_app database for the 
zf user user. Choose Check All and click on Go. 


localhost / localhost | phpMyAdmin 3.4.10.1deb1 - Mozilla Firefox 


dd, localhost / localhost | phpMyA... 
$ localhost vy @| |> 


er — 
phpMyAdmin Edit Privileges: User 'zf user'@'%' - Database Zf|_app 


Database-specific privileges (Check All / Uncheck All) 


2 l B O @ 
information_schema 
= Note: MySQL privilege names are expressed in English 

mysql 
performance_schema Data Structure Administration 
phpmyadmin 

(@ seLect (H CREATE (HF GRANT 

(@ INSERT @ ALTER (Hf Lock TABLES 
zf_app @ UPDATE (HF Index ( REFERENCES 

(@ DELETE (H vrop 

(@ CREATE TEMPORARY TABLES 


test 


(@ show view 

@ CREATE ROUTINE 
( ALTER ROUTINE 
@ EXECUTE 

( CREATE VIEW 
@ EVENT 

(@ TRIGGER 





You can now test the database by logging out of phoMyAdmin and logging in again with the 
user credentials of zf user. You should now be able to see only the zf_app database. 


What just happened? 


We just created our first database in MySQL. We have also created a user in the database 
and mapped the user to the database with administrative rights; we can now use these 
credentials in the application that we will be building in our next chapters. 





Now that you have the PHP web server up and running and also have a MySQL database, 
create a simple table called Students and add a few records to the table using phpMyAdmin. 


Your task will be to create a simple PHP web page that will display all the records in the 
Students table in the page. 
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Pop quiz — Zend Framework 2.0 


Q1. What is the minimum version of PHP needed to run Zend Framework 2.0? 


PHP 4.3 and above 

PHP 5.2.0 and above 
PHP 5.3.3 and above 
PHP 5.4.7 and above 


oo et oe 


Q2. What is the default location of php. ini in the new Zend Server installation? 


/home/<user>/etc/php/php.ince 
/etc/php/php.ini 
/var/www/php.ini 


a er TS 


/usr/local/zend/etc/php.ini 


Summary 


In this chapter we have learned the setup and configuration of Zend Server's PHP application 
stack. We went on to install MySQL Server and created our first database. In your exercises, 
you have learned about the installation of Git and phpMyAdmin. 


In the next chapter, we will learn about the structure of a Zend Framework project and core 
MVC components such as views and controllers. 
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Building Your First Zend 
Framework Application 








In this chapter, we are going to create our first Zend Framework 2.0 project; we 
will be reviewing some of the key aspects of building a ZF2 MVC Application by 
creating modules, controllers, and views. We will be creating our own custom 
module in Zend Framework which will be enhanced further in subsequent 
chapters of this book. 





Before you get started with setting up your first ZF2 Project, make sure that you have the 
following software installed and configured in your development environment: 

PHP Command Line Interface 

Git: Git is needed to check out source code from various github. com repositories 


Composer: Composer is the dependency management tool used for managing PHP 
dependencies 


Building Your First Zend Framework Application 


The following commands will be useful for installing the necessary tools to setup 
a ZF2 Project: 


@  Toinstall PHP Command Line Interface: 
$ sudo apt-get install php5-cli 


@ = To install Git: 
$ sudo apt-get install git 


al 


@ To install Composer: 


$ curl -s https://getcomposer.org/installer | php 


ZendSkeletonApplication provides a sample skeleton application that can be used 
by developers as a starting point to get started with Zend Framework 2.0. The skeleton 
application makes use of ZF2 MVC, including a new module system. 


ZendSkeletonApplication can be downloaded from GitHub 
(https: //github. com/zendframework/ZendSkeletonApplication). 


Time for action — creating a Zend Framework project 





To set up a new Zend Framework project, we will need to download the latest version of 
ZendSkeletonApplication and set up a virtual host to point to the newly created Zend 
Framework project. The steps are given as follows: 


1. Navigate to a folder location where you want to set up the new Zend 
Framework project: 


$ cd /var/www/ 


2. Clone the zendSkeletonApplication app from GitHub: 


$ git clone git://github.com/zendframework/ 
zendSkeletonApplication.git CommunicationApp 
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CommunicationApp h 


v ag Var M var www CommunicationApp Q Search 
> Æ backups 


> |i cache = E 

> Æ crash wat | 
> ma Games module 
> (aa lib 


> jad local ' — 


f 
1 


> il lock 
> im log 
> ja mail j 
> Æ opt fedis 
> Erun composer.phar init_autoloader.php LICENSE.txt 
> im Spool 
> Æ tmp 
v a www README.md 

> [F CommunicationApp 


composer.json 


> 
Lopyr 
All 





A! In some Linux configurations, necessary permissions may not be available to 
Q the current user for writing to /var/www. In such cases, you can use any folder 
that is writable and make necessary changes to the virtual host configuration. 


3. Install dependencies using Composer: 
$ cd CommunicationApp/ 
$ php composer.phar self-update 
$ php composer.phar install 


The following screenshot shows how Composer downloads and installs the 
necessary dependencies: 


krishnav@ubuntu: /var/www/CommunicationAppS php composer .phar self-update 
Updating to version 172414a. 

Downloading: 100% 
krishnav@ubuntu: /var /www/CommunicationApp$ php composer.phar install 
Loading composer repositories with package information 
Installing dependencies 

- Installing zendframework/zendframework (2.0.3) 
Downloading: 100% 


zendframework/zendframework suggests installing doctrine/common (Doctrine\Common >=2 
zendframework/zendframework suggests installing ext-intl (ext/intl for i18n features 
zendframework /zendframework suggests installing pecl-weakref (Implementation of weak 
zendframework/zendframework suggests installing zendframework/zendpdf (ZendPdf for ci 
zendframework/zendframework suggests installing zendframework/zendservice-recaptcha 
as in Zend\Captcha and/or Zend\Form) 

Writing lock file 

Generating autoload files 

krishnavé¢ : -/www/CommunicationApps 
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4. Before adding a virtual host entry we need to set up a hostname entry in our hosts 
file so that the system points to the local machine whenever the new hostname is 
used. In Linux this can be done by adding an entry to the /etc/hosts file: 


$ sudo vim /etc/hosts 


vl n 
Q In Windows, this file can be accessed at šSystemRoot% \ 


system32\drivers\etc\hosts. 


5. Add the following line to the hosts file: 
127.0.0.1 comm-app.local 


The final hosts file should look like the following: 


localhost 
ubuntu 
comm-app. Local 


following Lines are desirable for IPv6 capable hosts 


ip6-Localhost ip6- Loopback 
::8 ipő-localnet 
::0 1p6-mcastprefix 
ip6-allnodes 
ffO2::2 1p6-alLlrouters 





6. Our next step would be to add a virtual host entry on our web server; this can be 
done by creating a new virtual host's configuration file: 


$ sudo vim /usr/local/zend/etc/sites.d/vhost comm-app-80.conf 


This new virtual host filename could be different for you depending upon the 
web server that you use; please check out your web server documentation 
for setting up new virtual hosts. 

For example, if you have Apache2 running on Linux, you will need to create 
the new virtual host file in /etc/apache2/sites-available and 
enable the site using the command a2ensite comm-app. local. 


7. Add the following configuration to the virtual host file: 
<VirtualHost *:80> 
ServerName comm-app.local 
DocumentRoot /var/www/CommunicationApp/public 
SetEnv APPLICATION ENV "development" 
<Directory /var/www/CommunicationApp/public> 
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DirectoryIndex index.php 
AllowOverride All 
Order allow,deny 
Allow from all 
</Directory> 
</VirtualHost> 


A! If you are using a different path for checking out the 
Q ZendSkeletonApplication project make sure that you include 
that path for both DocumentRoot and Directory directives. 


8. After configuring the virtual host file, the web server needs to be restarted: 


$ sudo service zend-server restart 


9. Once the installation is completed, you should be able to open http: //comm-app. 
local on your web browser. This should take you to the following test page : 


ZF2 Skeleton Application - Mozilla Firefox 


ZF2 Skeleton Application z7 ZF2 Skeleton Application x 


© 





comm-app.local 


Welcome to Zend Framework 
2 


Congratulations! You have successfully installed the ZF2 Skeleton Application. You are currently 
running Zend Framework version 2.0.3. This skeleton can serve as a simple starting point for you to 
begin building your application on ZF2. N 


Fork Zend Framework 2 on GitHub » 





Follow Development Discover Modules Help & Support 


Zend Framework 2 is under active The community is working on developing a lf you need any help or support while 
development. If you are interested in following community site to serve as a repository and developing with ZF2, you may reach us via 
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Test rewrite rules 


i In some cases, mod_rewrite may not have been enabled in your web server 
~ by default; to check if the URL redirects are working properly, try to navigate 
Q to an invalid URL such as http: //comm-app.local/12345; if you get an 
Apache 404 page, then the . htaccess rewrite rules are not working; they 
will need to be fixed, otherwise if you get a page like the following one, you 
can be sure of the URL working as expected. 


Home 


A 404 error occurred 


Page not found. 


The requested URL could not be matched by routing. 


© 2005 - 2012 by Zend Technologies Ltd. All rights reserved. 





What just happened? 


We have successfully created a new ZF2 project by checking out ZendSkeletonApplication 
from GitHub and have used Composer to download the necessary dependencies including 
Zend Framework 2.0. We have also created a virtual host configuration that points to the 
project's public folder and tested the project in a web browser. 


Downloading the example code 


purchased from your account at http: //www. packtpub.com. If you 
purchased this book elsewhere, you can visit http: //www.packtpub. 
com/support and register to have the files e-mailed directly to you. 


Q You can download the example code files for all Packt books you have 
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Alternate installation options 

We have seen just one of the methods of installing 
ZendSkeletonApplication; there are other ways of doing this. 

You can use Composer to directly download the skeleton application and 
create the project using the following command: 

$ php composer.phar create-project --repository- 
url="http://packages.zendframework.com" zendframework/ 
skeleton-application path/to/install 

You can also use a recursive Git clone to create the same project: 


$ git clone git://github.com/zendframework/ 
zendSkeletonApplication.git --recursive 


Refer to: 


http: //framework. zend.com/downloads/skeleton-app 


Zend Framework 2.0 — modules 


In Zend Framework, a module can be defined as a unit of software that is portable and reusable 
and can be interconnected to other modules to construct a larger, complex application. 


Modules are not new in Zend Framework, but with ZF2, there is a complete overhaul in the 
way modules are used in Zend Framework. With ZF2, modules can be shared across various 
systems, and they can be repackaged and distributed with relative ease. One of the other 
major changes coming into ZF2 is that even the main application is now converted into a 
module; that is, the application module. 


Some of the key advantages of Zend Framework 2.0 modules are listed as follows: 


+ © ©% o 


Self-contained, portable, reusable 


Dependency management 


Lightweight and fast 


Support for Phar packaging and Pyrus distribution 
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Zend Framework 2.0 — project folder structure 


The folder layout of a ZF2 project is shown as follows: 


CommunicationApp 
> Æ spool 
> |g tmp 
T awww 
v I CommunicationApp 
> Æ config modüle 
> Æ data 
¥ ia module 
> Æ Application 
¥ E public 
> i css 
> | images 
D> E js composer.lock composer.phar init_autoloader.php 


E var www CommunicationApp public . Q, Search 


{ 


composer.json 


j 
f 


Y ja vendor Copyr 
> li bin +“ 
> im composer LICENSE.txt README.md 
¥ ja zendframework 

Y ja zendframework 

> Æ bin 
> E demos 
> Æ library 
> i resources 
> E tests 
> i vendor 

> i ZF2 





Folder name Description 

config Used for managing application configuration. 

data Used as a temporary storage location for storing application 
data including cache files, session files, logs, and indexes. 

module Used to manage all application code. 

module/Application This is the default application module that is provided with 


ZendSkeletonApplication. 


public Serves as an entry point to the application; the website's 
document root points here. All web resources including CSS 
files, images, and JavaScripts are stored here. 


vendor Used to manage common libraries that are used by the 
application. Zend Framework is also installed in this folder. 


vendor/zendframework Zend Framework 2.0 is installed here. 
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Time for action — creating a module 


Our next activity will be about creating a new Users module in Zend Framework 2.0. The 
Users module will be used for managing users including user registration, authentication, and 
so on. We will be making use of ZendSkeletonModule provided by Zend, shown as follows: 





1. Navigate to the application's module folder: 
$ cd /var/www/CommunicationApp/ 


$ cd module/ 


2. Clone ZendSkeletonModule into a desired module name, in this case it is Users: 


$ git clone git://github.com/zendframework/ZendSkeletonModule.git 
Users 


3. After the checkout is complete, the folder structure should look like the 
following screenshot: 


> jj config 
z autoload classmap. autoload function. 


Vv wa STC php php 
v wl ZendSkeletonModule 


> jj Controller 
> ja tests 


autoload register. LICENSE.txt Module.php 
php 


v iwi view 
v Wi zend-skeleton-module 
> id skeleton 


README.md 





4. Edit Module. php; this file will be located in the Users folder under modules 
(CommunicationApp/module/Users/module.php) and change the namespace to 
Users. Replace namespace ZendSkeletonModule; withnamespace Users;. 
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5. The following folders can be removed because we will not be using them in 
Our project: 


* Users/src/ZendSkeletonModule 


* Users/view/zend-skeleton-module 


What just happened? 


We have installed a skeleton module for Zend Framework; this is just an empty module, and 
we will need to extend this by creating custom controllers and views. In our next activity, we 
will focus on creating new controllers and views for this module. 


Creating a module using ZFTool 


ZFTool is a utility for managing Zend Framework applications/ 
projects, and it can also be used for creating new modules; in order to 
do that, you will need to install ZFTool and use the create module 
command to create the module using ZFTool1: 


A! $ php composer.phar require zendframework/ 
zftool:dev-master 
$ cd vendor/zendframework/zftool/ 
$ php zf.php create module Users2 /var/www/ 
CommunicationApp 


Read more about ZFTool at the following link: 


http: //framework. zend.com/manual/2.0/en/modules/ 
zendtool.introduction.html 


MVC layer 


The fundamental goal of any MVC Framework is to enable easier segregation of three layers 
of the MVC, namely, model, view, and controller. Before we get to the details of creating 
modules, let's quickly try to understand how these three layers work in an MVC Framework: 


@ Model: The model is a representation of data; the model also holds the business 
logic for various application transactions. 


@ View: The view contains the display logic that is used to display the various user 
interface elements in the web browser. 


@ Controller: The controller controls the application logic in any MVC application; all 
actions and events are handled at the controller layer. The controller layer serves 
as a communication interface between the model and the view by controlling the 
model state and also by representing the changes to the view. The controller also 
provides an entry point for accessing the application. 
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@ Inthe new ZF2 MVC structure, all the models, views, and controllers are grouped by 
modules. Each module will have its own set of models, views, and controllers, and 
will share some components with other modules. 


The folder structure of Zend Framework 2.0 module has three vital components—the 
configurations, the module logic, and the views. The following table describes how contents 
in a module are organized: 


Folder name Description 

config Used for managing module configuration 

Src Contains all module source code, including all controllers and models 
view Used to store all the views used in the module 


Time for action — creating controllers and views 





Now that we have created the module, our next step would be having our own controllers 
and views defined. In this section, we will create two simple views and will write a controller 
to switch between them: 


1. Navigate to the module location: 


$ cd /var/www/CommunicationApp/module/Users 


2. Create the folder for controllers: 


$ mkdir -p src/Users/Controller/ 


3. Create anew IndexController file, < ModuleName >/src/<ModuleName>/ 
Controller/: 
$ cd src/Users/Controller/ 


$ vim IndexController.php 


4. Add the following code to the IndexCont roller file: 
<?php 
namespace Users\Controller; 
use Zend\Mvc\Controller\AbstractActionController; 
use Zend\View\Model\ViewModeli ; 
class IndexController extends AbstractActionController 


{ 


public function indexAction () 


{ 
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Sview = new ViewModel () ; 
return Sview; 


} 


public function registerAction () 


{ 


Sview = new ViewModel () ; 
Sview->setTemplate('users/index/new-user'); 


return Sview; 


} 


public function loginAction () 


{ 


Sview = new ViewModel () ; 
Sview->setTemplate('users/index/login') ; 
return Sview; 


} 


5. The preceding code will do the following actions; if the user visits the home page, 
the user is shown the default view; if the user arrives with an action register, the 
user is shown the new-user template; and if the user arrives with an action set to 
login, then the login template is rendered. 


6. Now that we have created the controller, we will have to create necessary views to 
render for each of the controller actions. 


7. Create the folder for views: 
$ cd /var/www/CommunicationApp/module/Users 


$ mkdir -p view/users/index/ 


8. Navigate to the views folder, <Module>/view/<module-name>/ index: 


$ cd view/users/index/ 


9. Create the following view files: 
a index 
Q login 


ü new-user 


1. For creating the view/users/index/index.phtml file, use the 
following code: 
<hl>Welcome to Users Module</h1> 


<a href="/users/index/login">Login</a> | <a href="/users/ 
index/register">New User Registration</a> 
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2. Forcreating the view/users/index/login.phtml file, use the 
following code: 


<h2> Login </h2> 
<p> This page will hold the content for the login form </p> 
<a href="/users"><< Back to Home</a> 


3. Forcreating the view/users/index/new-user.phtml file, use the 
following code: 


<h2> New User Registration </h2> 

<p> This page will hold the content for the registration 
form </p> 

<a href="/users"><< Back to Home</a> 


What just happened? 


We have now created a new controller and views for our new Zend Framework module; 
the module is still not in a shape to be tested. To make the module fully functional we will 
need to make changes to the module's configuration, and also enable the module in the 
application's configuration. 


Zend Framework 2.0 module configuration is spread across a series of files which can be 
found in the skeleton module. Some of the configuration files are described as follows: 


@ Module. php: The Zend Framework 2 module manager looks for the Module. php 
file in the module's root folder. The module manager uses the Module. php file to 
configure the module and invokes the getAutoloaderConfig() and getConfig() 
methods. 


@ autoload classmap.php: The getAutoloaderConfig() method in 
the skeleton module loads autoload_classmap. php to include any custom 
overrides other than the classes loaded using the standard autoloader format. 
Entries can be added or removed to the autoload_classmap. php file to 
manage these custom overrides. 


@ config/module.config.php: The getConfig() method loads 
config/module.config. php; this file is used for configuring various 
module configuration options including routes, controllers, layouts, and 
various other configurations. 
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Time for action — modifying module configuration 





In this section will make configuration changes to the Users module to enable it to work 
with the newly created controller and views using the following steps: 


1. Autoloader configuration — The default autoloader configuration provided by 
the ZendSkeletonModule needs to be disabled; this can be done by editing 
autoload_classmap.php and replacing it with the following content: 


<?php 
return array (); 


2. Module configuration — The module configuration file can be found in 
config/module.config. php; this file needs to be updated to reflect 
the new controllers and views that have been created, as follows: 


a Controllers — The default controller mapping points to the 
ZendSkeletonModule; this needs to be replaced with the 
mapping shown in the following snippet: 


'controllers' => array ( 
'a3nvokables! => array ( 


'Users\Controller\Index' => 
'Users\Controller\IndexController', 


), 
), 


a Views -— The views for the module have to be mapped to the appropriate 
view location. Make sure that the view uses lowercase names separated by a 
hyphen (for example, ZendSkeleton will be referred to as zend-skeleton): 

'view manager' => array ( 
'template path stack' => array ( 
'users' => DIR. '/../view', 
F 
yey 


a Routes — The last module configuration is to define a route for accessing 
this module from the browser; in this case we are defining the route as 
/users, which will point to the index action in the Index controller of 
the Users module: 


'router' => array ( 
'routes! => array ( 
'users' => array ( 
'type'! => 'Literal', 
'options' => array ( 
'route'! => '/users', 
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'defaults' => array ( 
, NAMESPACE => 
'Users\Controller', 
'controller' => 'Index', 
"action' => 'index', 


), 
T 


3. After making all the configuration changes as detailed in the previous sections, 
the final configuration file, config/module.config.php, should look like 
the following: 
<?php 
return array ( 

'controllers' => array ( 

'anvokables! => array ( 
'Users\Controller\Index'! => 
'Users\Controller\IndexController', 

is 
E 


'router! => array ( 
'routes! => array ( 
'users' => array ( 
'type'! => 'Literal', 
'options' => array ( 


// Change this to something specific to 
your module 


'route'! => '/users', 
'defaults!' => array ( 


// Change this value to reflect the 
namespace in which 


// the controllers for your module are 


found 
' NAMESPACE _' => 'Users\Controller', 
'controller' => 'Index', 
'action' => 'index', 
), 

), 

'may terminate' => true, 

'child. routes" => array ( 


// This route is a sane default when 
developing a module; 


// as you solidify the routes for your module, 
however, 


// you may want to remove it and replace it 
with more 
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// specific Toutes. 


'default' => array ( 
'type'! => 'Segment', 
'options' => array ( 
'route' => 
'/[:controller[/:action]]', 
'constraints' => array ( 
controller! => 
WMla=Z2A=Zl [a-7z2A=- 2079 =] +1; 
'action' => 


Nla=ZA=Z.l laezA=Z0=9) =] +1; 
E 


'defaults' => array ( 
Ne 
lS 
Ja 
F 
E 
Ja 
ig 
'view_manager' => array ( 
'template path stack' => array ( 
'users' => DIR. _  . '/../view', 


E 
Fa 
E 


4. Application configuration — Enable the module in the application's configuration— 
this can be done by modifying the application's config/application.config. 
php file, and adding Users to the list of enabled modules: 


'modules' => array ( 
'Application', 
'Users', 


), 


5. To test the module in a web browser, open http: //comm-app.local/users/ in 
your web browser; you should be able to navigate within the module. 


Chapter 2 
The module home page is shown as follows: 


ZF2 Skeleton Application - Mozilla Firefox 


z7 7F2 Skeleton Application 


= comm-app.local/users 


Welcome to Users Module 


Login | New User Registration 
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The registration page is shown as follows: 


ZF2 Skeleton Application - Mozilla Firefox 
2? ZF? Skeleton Application 


= comm-app.local/users/index/registe 


New User Registration 


This page will hold the content for the registration form 


<< Back to Home 
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What just happened? 


We have modified the configuration of ZendSkeletonModule to work with the new 
controller and views created for the Users module. Now we have a fully-functional 
module up and running using the new ZF module system. 





Now that we have the knowledge to create and configure own modules, your next task 
would be to set up a new CurrentTime module. The requirement for this module is to 
render the current time and date in the following format: 


Time: 14:00:00 GMT Date: 12-Oct-2012 


Pop quiz — Zend Framework 2.0 


Q1. What is the tool used by ZendSkeletonApplication for managing dependencies 
in PHP? 


Git 
Composer 


PHP Command Line Interface 


ey Ghee T 


Pyrus 
Q2. What is the filename of a module's configuration file? 


<App>/module/<Module>/config.ine 
<App>/<Module>/config/config.php 
<App>/module/<Module>/module.config.php 


ee aS le 


<App>/module/<Module>/config/module.config.php 


Summary 


We have now learned about setting up a new Zend Framework project using Zend's skeleton 
application and module. In our next chapters, we will be focusing on further development on 
this module and extending it into a fully-fledged application. 











In the previous chapter, we covered creating controllers and views in a new 
Zend Framework module. In this chapter we will create our first registration 
form, and set up login and authentication for registered users using Zend 
Framework components. 





Some of the key components that we will focus on in this chapter are listed as follows: 


Zend\Form 
Zend\InputFilter 
Zend\Validator 
Models and Zend\Db 
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Zend\Form 


Forms are usually built by creating the HTML page for the form, writing separate validation 
and filtering for various form events, and finally writing the controllers and actions for the 
form actions. With Zend Framework, the Zend\ Form component provides all the previously 
stated features in a single component. 


Zend\Form allows developers to programmatically create and handle forms in your 
applications. Zend\Form supports form rendering, form handling, input filtering and 
validation, and form configurations. In our next task we will set up our first form in ZF2. 
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Time for action — creating a registration form 





To create our first registration form, we will create a new controller to display a registration 
form; we will also create new forms and views. We need to make the following changes to 
the Users module: 


1. Form- We will also need to create a registration form under src/Users/Form/ 
RegisterForm. php: 


1. The RegisterForm class extends Zend\Form\ Form; the form's 
configuration is added to the constructor: 


<?php 

// filename : module/Users/src/Users/Form/RegisterForm. php 
namespace Users\Form; 

use Zend\Form\Form; 

class RegisterForm extends Form 


{ 


public function _ construct ($name = null) 
parenti:  CONStIUCE Register”); 
Sthis->setAttribute('method', 'post'); 
Sthis->setAttribute('enctype', 'multipart/form- 
data'); 


2. All fields are added to the form using the Sthis->add() method on the 
form's constructor: 


Sthis->add (array ( 


‘name! => 'name', 

'attributes!' => array ( 
"type! => text"; 

Fy 

'options' => array ( 


'label' => 'Full Name" 
a 
EE 


3. Additional validators/filters can be added to the fields while declaring 
the fields in the form. In this case we are adding special validation for 
the EmailAddress field: 


Sthis->add (array ( 


'name' => 'email', 
'attributes' => array ( 
'type' => 'email', 


) 
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'options' => array ( 
'label' => 'Email', 
ae 
‘attributes! => array ( 
'required' => 'required' 
hy 
'filters' => array ( 
array('name' => 'StringTrim'), 
F 
'validators' => array ( 
array ( 
'name! => 'EmailAddress', 
'options' => array ( 
'messages! => array ( 
\Zend\Validator\ 


EFmailAddress::INVALID FORMAT => 'Email address format is 
invalid' 


BE 


4. Use the same method to add password, confirm password, and 
submit fields; password and confirm password will be of type 
password, whereas submit will be of type button. 


Views — The following views will have to be created to support the 
registration process: 


1. Registration page: The view for registration page is created in src/view/ 
users/register/index.phtml. 


2. The view consists of three main sections—the section to display error 
messages, the view logic which is used to generate the form tag, and the 
view helpers used to generate the actual form elements. The following logic 
is used to display error messages: 


<section class="register"> 
<h2>Register</h2> 
<?php if (Şthis->error): ?> 
<p class="error"> 


There were one or more issues with your submission. 
Please correct them as 


indicated below. 
</p> 
<?php endif ?> 
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3. The following block is used to generate the <form> HTML tag using the 
form object assigned to the view in the controller: 
<?php 
Sform = Sthis->form; 
Sform->prepare () ; 
Sform->setAttribute('action', Sthis-surl(NULL, 
array ('controller'=>'Register', 'action' => 'process'))); 
Sform->setAttribute('method', 'post'); 
echo Sthis->form() ->openTag(Sform) ; 


?> 


4. The following section is used to generate individual form elements for the 
Name, Email, Password, Confirm Password, and Submit fields: 


<dl class="zend form"> 
<dt><?php echo Sthis->formLabel ($form-sget ('name')); ?></dt> 
<dd><?php 

echo Sthis->formElement (Sform->get ('name') ) ; 

echo Sthis->formElementErrors (Sform->get ('name') ) ; 
?></dd> 
<dt><?php echo Sthis->formLabel (S$form->get('email')); ?></ 
dt> 
<dd><?php 

echo Sthis->formElement (Sform->get ('email')); 

echo Sthis->formElementErrors (Sform->get ('email')); 
?></dd> 


<dt><?php echo Sthis->formLabel ($form->get ('password') ) ; 
?></dt> 


<dd><?php 
echo Sthis->formElement (Sform->get ('password') ) ; 
echo Sthis->formElementErrors (Sform->get ('password') ) ; 


?></dd> 

<dt><?php echo $this->formLabel ($form->get ('confirm_ 
password')); ?></dt> 

<dd><?php 


echo $this->formElement ($form->get ('confirm password') ) ; 
echo Sthis->sformElementErrors(sform-sget (confirm. 
password') ) ; 
?></dd> 
<dd><?php 
echo Sthis->formElement (Sform->sget('sSubmit') ) ; 
echo Sthis->formElementErrors (Sform->get ('submit') ) ; 
?></dd> 
</dl> 
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5. Finally the form HTML tag needs to be closed: 


<?php echo Sthis->form()->closeTag() ?> 
</section> 


6. Confirmation page: The view for the confirmation page is pretty 
straightforward, the view is created in src/view/users/register/ 
confirm.phtml. 


<section class="register-confirm"> 
<h2>Register Sucessfull</h2> 

<p> Thank you for your registration. </p> 
</section> 


Controller — Now that we have the form and views ready, our next step will be to 
have a controller in place, which will help us to access this form. We will create a 
new RegisterController class and load the newly created form in its index 
action. The new controller will be created in the src/Users/Controller/ 
RegisterController. php file: 

<?php 

namespace Users\Controller; 

use Zend\Mvc\Controller\AbstractActionController; 

use Zend\View\Model\ViewModeli ; 

use Users\Form\RegisterForm; 

class RegisterController extends AbstractActionController 


{ 


public function indexAction () 


{ 


Sform = new RegisterForm() ; 


SviewModel = new ViewModel (array('form' => 
$form) ) ; 


return SviewModeli ; 


} 


public function confirmAction () 


{ 


SviewModel = new ViewModel (); 
return SviewModeli ; 
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4. Configuration — Now we have created all the necessary components to display our 
form, we need to add our controller to the invokables list in the module config 
(config/module.config. php): 


'controllers' => array ( 
'a3nvokables! => array ( 
'Users\Controller\Index!' => 


'Users\Controller\IndexController', 


'Users\Controller\Register' => 
'Users\Controller\RegisterController', 


F 
5. To test the registration form's display, open any web browser and try accessing the 
following URL: 
http://comm-app.local/users/register 


The registration form should look like the following: 


Register 


Full Name 


Password 


Contirm Password 


Register 
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What just happened? 

Until now we have created a form that can be used to display all the necessary fields that 

can be used during the registration process. Let us try to understand how the form is being 
rendered. When we invoke the http: //comm-app.local/users/register page, the 
controller creates a new instance of the RegisterForm Class and displays it on the web 
browser. We have added the following fields to the RegisterForm Class using its constructor: 
Name 

Email 

Password 

Confirm Password 


The Submit button 
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These fields are added to the newly created Form object. The ViewModel pattern renders 
the form, and the form object gets passed over to the view for rendering, and each field is 
rendered as per the logic in the view using the FormElement view helper. 


FormElement works as a magic helper to render any form field based on 
j the type of the Zend\Form\Element tag that is passed on to it. There 
E are individual helpers for rendering specific form fields. The complete 
Q list of form view helpers can be obtained from the ZF documentation 
on Form View Helpers found at http: //framework. zend.com/ 
manual/2.0/en/modules/zend.form.view.helpers.html. 


Before we move on to the next section, please create a login form in the same way that we 
used to create the registration form. The form will contain the following fields: 


@ Email 
@ Password 
@ The Submit button 


We will be using this login form to perform authentication towards the end of this chapter. 
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If you had taken a closer look at the form code, you would have noticed that we have added 
some validation for the Email Address field as shown in the following snippet: 


‘attributes! => array ( 
'required' => 'required' 
Re 
'filters' => array ( 
array('name' => 'StringTrim'), 
Pa 
'validators! => array ( 
array ( 
'name!' => 'EmailAddress', 
"options! => arrayi 
'messages! => array ( 
\Zend\Validator\EmailAddress: : INVALID _ 


FORMAT => 'Email address format is 
invalid' 


So, we added the following: 


@ An attribute to make the field a required field 
@ A filter to trim the string that is passed 


@ A validator to verify if the e-mail address is in the valid format 


With the introduction on Zend Framework's InputFilter, we can validate entire forms 

instead of attaching validation to each and every form field. This allows much cleaner code 
and better scalability of Zend Forms. So effectively we can have the same form being used 

in multiple sections of the website, each having its own set of validation rules that are not 
dependant on the form's validation. In our next section we will set up a new validator for the 
registration form. 


Zend\inputFilter 


Validation for forms and various other inputs can be performed by making use of Zend\ 
InputFilter. This component allows filtering and validation of generic sets of input data. 
For specific form elements you can apply validation and filtering on the specific elements, 
but if we have to filter an input set like a $ GET request ora $_POST request, this can be 
implemented using the Input Filter class. 


In our next task, we will be adding the Input Filter class to our registration form. 
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Time for action — adding validation to the registration form 





To add an InputFilter class to an existing form, we need to create a new Input Filter 
class and use it during form submission for validation, as shown in the following steps: 


1. Create anew InputFilter class in src/Users/Form/RegisterFilter.php. 
The RegisterFilter class will extend the Zend\InputFilter\InputFilter 
class and will add all the necessary validators in its constructor: 
<?php 
namespace Users\Form; 
use Zend\InputFilter\InputFilter; 


class RegisterFilter extends InputFilter 


{ 


public function -construct 


{ 


2. Using the $this->add() method, we can add various filter options to the 
registration form: 


1. For the Email Address field, we will add a validator to check if the value 
entered is a valid e-mail address: 


Sthis->add (array ( 
'name ! => 'email', 
'required' => true, 
'validators! => array ( 
array ( 
'name '! => 'EmailAddress', 
‘Options => array ( 


'domain' => true, 


2. For the Name field, we will add a validator to limit the size between 2 to 
140 characters and will also add a filter to strip the HTML tags: 


Sthis->add (array ( 


‘name ' => 'name', 
'required' => true, 
'filters' => array ( 
array ( 
'name ! => 'Striplags'; 


), 
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), 


'validators! => array ( 
array ( 
'name ! =>. “Stringhength" ; 
'options' => array ( 


'encoding'! => 'UTF-8', 
'min' => 2; 
'max' => 140, 


3. For the Password and Confirm Password fields, we will not add any 
validators but will make them mandatory: 


'password' ee 
Sthis->add (array ( 
‘name ' => 'confirm password', 
'required' => true, 


ie 


3. This InputFilter class is not mapped to the RegisterForm Class yet; we will 
be performing the validation during form submission. We need to modify the 
RegisterController class to enable the processAction method and validate 
the form upon submission. 


4. Modify the RegisterCont roller class to enable the processAction method: 


public function processAction () 
{ 
if (!$this->request->isPost()) { 
return Sthis->redirect()->stoRoute (NULL , 
array( '‘controller' => 'register', 
"ction! => —-landex? 
DE 
} 
Spost = Sthis->request->getPost () ; 
Sform = new RegisterForm() ; 
SinputFilter = new RegisterFilter() ; 
Sform->setInputFilter (SinputFilter) ; 
Sform->setData(Spost) ; 
if (!$form->isValid()) { 
Smodel = new ViewModel (array ( 
'error' => true, 
'form' => $form, 


Pie 
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Smodel->setTemplate('users/register/index') ; 
return Smodel; 


return Sthis->redirect ()->toRoute (NULL , array ( 
‘controller’ => *redister’, 
'action' => 'confirm' 


os 
} 


5. Now open the registration page in your web browser and test the validation: 


Register 


There were one or more isues with your submission. Please correct them as 
indicated below. 


Full Name 
Terry Smith 


Email 


terry_smith@yahoo 


+ ‘yahoo is not a valid hostname for the email address 

+ The input does not match the expected structure for a DNS hostname 

e The input appears to be a local network name but local network names 
are not allowed 


Password 


Confirm Password 


Register 
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What just happened? 


We have now enabled validation on the registration form. In the processAction () 
function of the RegisterController class, you will see that a new instance of the 
RegisterFrom Class is created and RegisterFilter is applied to the form using the 
Sform->setInputFilter() method. The data entered as input to the form is added again 
and validation is performed by using the isValid() method. Error messages are rendered 
in the form using the FormElementErrors view helper. 


We need to ensure that the names in the Input Filter class properly map to the names in 
the form while adding validation to InputFilter. 


You've just learned about adding a custom Input Filter class to a Zend form using the 
previous task; before you move on to the next section, set up a validation Input Filter 
for the Login form that you have built in your previous exercise. 


Models provide a representation of data in the MVC application. There is no Zend\Model 
component that is provided by Zend Framework, so developers have to decide on the 
implementation part of models. Models by themselves cannot talk to databases and fetch 
or process data, so they are usually connected to mapper objects or use ORM to connect 
to databases. For this example, we will be using a TableGateway pattern for storing data 
in the database. 


TableGateway is a built-in Zend Framework 2 DB pattern which acts as a 


gateway to a database table, having access to all table rows for performing 
various SQL operations including select, insert, update, and delete. 


TableGateway 


The TableGateway pattern is used for creating an object that represents a table in the 
database; in this example, we will need a TableGateway object for the User table. 


A! The exchangeArray () method needs to be declared 
Q in the model if the model uses TableGateway for 
database storage. 
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Time for action — creating models and saving the form 





In this task, we will be creating a new user model, creating a table in MySQL database to save 
the registration data using TableGateway to store registration data to the table. We will, 
finally, connect our registration form to UserTable so that new registrations are stored in 
the database. Perform the following steps to do so: 


1. Anew table needs to be created to store the registration information in the 
MySQL database: 


CREATE TABLE user ( 
id INTEGER UNSIGNED NOT NULL AUTO INCREMENT, 
name TEXT NOT NULL, 
email VARCHAR (255) NOT NULL, 
password TEXT NOT NULL, 
PRIMARY KEY (id), 
UNIQUE INDEX idx email (email) 
E 


2. The application's global configuration needs to be modified to add references to 
the database connection as shown in the following snippet. This is available under 
<Application Home>/config/autoload/global. php. 


return array ( 
'db' => array ( 


'driver' => 'Pdo', 

'dsn' => 'mysql:dbname=test;host=localhost', 
‘username ' => 'db_user', 

'password' Se tE, 

'driver_options' => array ( 


PDO: :MYSQL ATTR_INIT_COMMAND => 'SET NAMES \'UTF8\!'! 
y 
E 
'service_manager' => array ( 
'factories' => array ( 
'Zend\Db\Adapter\Adapter' 
=> 'Zend\Db\Adapter\AdapterServiceFactory', 
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3. Create a new model for the User class. This needs to be created under 
src/Users/Model/User.php. 
<?php 
namespace Users\Model; 
class User 


{ 
public $id; 
public Sname; 
public Semail; 
public Spassword; 


} 


4, The User model will define the set Password () and the exchangeArray () 
methods: 


1. Implement a set Password () method which will assign a MD5 version 
password to the UserTable entity for storage: 


public function setPassword($clear_ password) 


{ 


Sthis->password = md5(Sclear password) ; 


} 


2. Implement the exchangeArray () method; this method is used while 
mapping the User entity to the UserTable entity: 


function exchangeArray (Sdata) 


{ 


Sthis->name = (isset(Sdata['name'])) ? 
Sdata['name'] : null; 

Sthis->email = (isset(Sdatal['email'])) ? 
Sdata['’email!] : null; 


if (isset ($data["password"] ) ) 


{ 


Sthis->setPassword(Sdata["password"] ) ; 


} 


5. Create a new table reference for User. This needs to be created under src/Users/ 
Model/UserTable.php: 
<?php 
namespace Users\Model; 
use Zend\Db\Adapter\Adapter; 
use Zend\Db\ResultSet\ResultSet; 
use Zend\Db\TableGateway\TableGateway; 
class UserTable 


— 15 2 ANY 
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protected StableGateway; 
public function construct (TableGateway StableGateway) 


{ 
} 


public function saveUser (User Suser) 


{ 


Sthis->tableGateway = StableGateway; 


Sdata = array ( 
'email' => Suser->email, 
'name' => Suser-sname, 
'password! => Suser->password, 
3 
Sid = (int) Suser->5id; 
if (Sid == 0) { 
Sthis->tableGateway->insert ($data); 
} else { 
if (Sthis->getUser(Sid)) { 
Sthis->tableGateway-supdate(Sdata, array('id' => $id)); 
} else { 
throw new \Exception('User ID does not exist'); 


} 


public function getUser ($id) 


{ 
Sid = (int) Sid> 
Srowset = Sthis->tableGateway->select (array('1id' => $id)); 
Srow = Srowset->scurrent () ; 
if (!Srow) { 
throw new \Exception("Could not find row $id"); 


} 


return $row; 


} 


Now we can use UserTab1le to save new registrations to the database. To save 
registrations, we need to make changes to the RegisterController Class. First, 
we will create a new function for saving user registration: 


protected function createUser(array $data) 


{ 


Ssm = Sthis->sgetServiceLocator () ; 
SdbAdapter = S$sm->get('Zend\Db\Adapter\Adapter') ; 
SresultSetPrototype = new \Zend\Db\ResultSet\ResultSet (); 
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7. 


SresultSetPrototype->setArrayObjectPrototype (new 
\Users\Model\User) ; 

StableGateway = new \Zend\Db\TableGateway\TableGateway('user', 
SdbAdapter, null, SresultSetPrototype) ; 


Suser = new User(); 
Suser->exchangeArray (Sdata) ; 

SuserTable = new UserTable(StableGateway) ; 
SuserTable->saveUser (Suser) ; 

return true; 


The TableGateway constructor takes the following parameters and 
generates a TableGateway object in response: 


@ Stable: Used to provide the table name for the TableGateway 
object. 

@ Adapter Sadapter: Used to provide the database adapter 
name. 

@ features (optional): TableGateway Feature API allows the 
extension of the TableGateway functionality without having 

to extend the base class. The features can be specified here. 

JS @ ResultSet $resultSetPrototype (optional): Used to 
provide the ResultSet type. 

@ Sql $sql (optional): Used to provide any additional SQL criteria; 
make sure that the SQL object is bound to the same table as in 
Stable. 

@ For more information refer to: 
http://framework.zend.com/manual/2.0/en/ 
modules/zend.db.table-gateway.html#zend-db- 
tablegateway 


Next, we need to make sure that the processAction() method calls this function 
before redirecting to the confirmation page: 


// Create user 
Sthis->createUser (S$form-sgetData() ) ; 
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8. Open the registration page in your favourite browser and use the MySQL database 
to check if the registration information is properly stored in the database. The 
registration confirmation page should look like the following screenshot: 


Register Sucessfull 


Thank you for your registration. 
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You can check the MySQL database to see if the records have been inserted properly: 


ysql> SELECT id, name, 


Terry a ter barrio atime | S ars d61d8327deb882 


John Smit john. smith@email.com 5f4dcc3b5a 2a765d61d 8327 deb882c 


Mani Raj R iĝemail. com Baz! dco3b b5aa765d61d832/7debs882 
User test.user@email.com Berg lees) =a 327 deb882c 





What just happened? 


We have now modified the form to save new user registrations to the database; our next 
step will be to set up authentication based on the information stored in the database. 


Zend\Authentication 


Zend\Authentication is an authentication component provided by Zend Framework 
which can be used for authentication against a wide number of authentication mechanisms 
including database table, HTTP authentication, and LDAP authentication. The component 
also lets you store the session information to a wide range of storages. 


In this example, we will be using the Zend\Authent ication component to validate the 
user credentials submitted in the login form. 
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Time for action — user authentication 





In this task we will be authenticating the login form using the Zend\Authentication 
component using the following steps: 


í; 


Add a function to return the authentication service in the login controller src/ 
Users/Controller/LoginController.php: 


// References 
use Zend\Authentication\AuthenticationService; 
use Zend\Authentication\Adapter\DbTable as DbTableAuthAdapter; 
// Class definition 
public function getAuthService () 
{ 
if (! Sthis->authservice) { 
SdbAdapter = Sthis->getServiceLocator () ->get ('Zend\Db\Adapter\ 
Adapter') ; 
SdbTableAuthAdapter = new DbTableAuthAdapter (S$dbAdapter, 
'user', 'email', 'password', 'MD5(?)'); 
SauthService = new AuthenticationService() ; 
SauthService->setAdapter (SdbTableAuthAdapter) ; 
Sthis->sauthservice = SauthService; 


} 


return Sthis-sauthservice; 


} 


In the processAction() method for LoginController, check if the form 
submission is valid, and use the AuthService method to validate the credentials 
using the authenticate method: 


public function processAction () 
// 
Sthis->getAuthService () ->getAdapter () 


->setIdentity (Sthis->request- 
>getPost ('email') ) 


->setCredential (Sthis->request- 
>getPost ('password')); 


Sresult = Sthis->getAuthService()->authenticate() ; 
if (Sresult->isValid()) { 
Sthis->getAuthService () ->getStorage() ->write (Sthis->request- 
>getPost('email')) ; 
return Sthis->redirect()->toRoute(NULL , array ( 
reoncroller® =s "login’, 
"action! == ““eonfirm' 
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3. The ConfirmAction function will render the logged in user's welcome screen: 


public function confirmAction () 


{ 
Suser email = $this->getAuthService () ->getStorage()->read(} ; 
SviewModel = new ViewModel (array ( 


'user email' => Suser_email 
Ia 


return SviewModeli ; 


} 


4. The view for the user's home page created under /view/users/login/confirm. 
phtm1 will be as follows: 


<section class="login-confirm"> 

<h2>Login Successful</h2> 

<p> Welcome! <?php echo $this->user email; ?> </p> 
</section> 


5. Open the login page in your browser and try to log in with the credentials that you 
used during registration. The login form should look like the following: 


Login 


Email 
test.user@email.com 
Password 


Login 
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Upon successful login, you will be redirected to the login success page as shown below. 


Login Sucessfull 


Welcome! test.user@email.com 
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What just happened? 


We created a new database table authentication adapter for the user table to validate 
the email and password fields. Using the authentication adapter we have been able to 
perform authentication for registered users. 


Pop quiz — Zend Framework 2.0 


Q1. Which file should be modified to store the database credentials application-wide? 


<App>/module/<Module>/config.ine 
<App>/config/autoload/global.php 
<App>/module/<Module>/module.config.php 


A e om 


<App>/module/<Module>/config/module.config.php 
Q2. What is the correct method to assign an input filter to a form? 


Sform->setInputFilter (SinputFilter) 
Sform->uselInputFilter (SinputFilter) 


Sform->assigninputFilter(SinputFilter) 


APP p 


Sform->mapInputFilter (SinputFilter) 


Summary 


In this chapter we have learned creating forms, doing basic validations, storing form data 
to the database, using models, and authenticating with the database. In the next chapter 
we will be learning about advanced database operations, which will be based on the 
TableGateway pattern that we have covered in this chapter. 








After getting ready to write your own basic models in the previous chapters, 
you can now learn how to make the most out of your Zend Framework's data 
and file management concepts in this chapter. 


In this chapter we will cover the following key topics: 


@ Zend Framework 2 ServiceManager 
@ The TableGateway pattern 


@ File uploads and file sharing using Zend Framework 


Zend Framework 2 ServiceManager 


The ZF2 ServiceManager implements the service locator design pattern. The service locator 
is a service/object locator used for retrieving other objects. 


The ServiceManager configurations are classified into six main categories; your 
application/module configuration will fall under one or more of the categories 
listed in the following table: 


Configuration type Description 
abstract_factories Used to define an array of abstract classes. 


aliases Used to define an associative array of alias name / target name pairs. 
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Configuration type Description 


factories Used to define an array of service name / factory class name pairs. 


The factory classes defined here should either implement Zend/ 
ServiceManager/FactoryInterface or invokable classes. 


invokables Used to define an array of service name / class name pairs. The classes 


services 


shared 


listed here may be directly instantiated without any constructor 
arguments. 


Used to define an array of service name / object pairs. The service is 
basically an instance of a class. Services can be used to register classes 
which are already initialized. 


Used to define an array of service name / Boolean pairs, indicating 
whether or not a service should be shared. All services are shared by 
default; this ServiceManager option can be used to disable sharing on 
specific services. 


The ServiceManager configuration can be stored either in the application configuration or 
in the module configuration; this can be chosen according to the needs, application, or 


module. 


Usually, the configuration, which is static across the application, is stored in the 


application-level configuration; all other information is stored at a module level. 


The configuration for ServiceManager is merged in the following order: 


1. 


Module configuration provided by the Module lass using the getServiceConfig () 
method. This will be processed in the same order in which the modules are processed: 


public function getServiceContiig () 


{ 
return array ( 
"abstract factories.” => array (), 
'aliases' => array(), 
'factories' => array(), 
'invokables' => array(), 
'services' => array(), 
'shared' => array(), 
E 
} 


Module configuration is present in the service manager key; again, this is 
processed in the same order in which the modules are processed. 


Application configuration is present in various configuration files in the 
config/autoload/ directory in the order in which they are processed: 


<?php 
return array ( 
'service manager! => array ( 
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'abstract_factories' => array (); 
'aliases' => array(), 
'factories” => array () ; 
'invokables' => array(), 
'services' => array(), 

'shared' => array(), 


Time for action — migrating existing code to ServiceManager 





Our next step will be to migrate existing code blocks to make use of ServiceManager. Some 
of the key factories that can be moved into ServiceManager are as follows: 

Database connections 

Models and table gateways 


Forms and filters 
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Authentication service 


If you review the existing code, you will be able to figure out that all the database connections 
are already using the Zend Framework 2 ServiceManager model for storing credentials. We 
will take one step forward and move the rest of the factories into ServiceManager using the 
following steps: 


1. Modify Module . php and add a new function to load the ServiceManager configuration: 


public function getServiceConfig() 
return array ( 
‘abstract factories' => array(), 
'aliases' => array(), 
'factories' => array ( 


// DB 

'UserTable' => function(Ssm) { 
StableGateway = $sm->get ('UserTableGateway' ) ; 
Stable = new UserTable(StableGateway) ; 
return Stable; 

z 

'UserTableGateway' => function ($sm) { 
SdbAdapter = $sm->get ('Zend\Db\Adapter\Adapter'!'); 
SresultSetPrototype = new ResultSet (); 
SresultSetPrototype->setArrayObjectPrototype (new User()) ; 
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return new TableGateway('user', SdbAdapter, null, 
SresultSetPrototype) ; 

ta 

// FORMS 

'‘LoginForm' => function ($sm) { 


Sform = new \Users\Form\LoginForm() ; 
Sform->setiInputFilter ($sm->get ('LoginFilter') ) ; 
return $form; 

iz 

'RegisterForm' => function (Ssm) { 
Sform = new \Users\Form\RegisterForm() ; 
Sform->setInputFilter ($sm->get ('RegisterFilter')); 
return Sform; 


by 


// FILTERS 
'LoginFilter' => function ($sm) { 
return new \Users\Form\LoginFilter() ; 
= 
'RegisterFilter' => function (Ssm) { 
return new \Users\Form\RegisterFilter(); 
iz 
Neg 
'invokables' => array(), 
'services! => array(), 
'shared'! => array(), 
B 
} 


2. Make sure that the Module. php file includes all the necessary namespaces: 


use Users\Model\User; 
use Users\Model\UserTable; 


use Zend\Db\ResultSet\ResultSet; 
use Zend\Db\TableGateway\TableGateway; 


[621 


Chapter 4 


Using namespaces 


Namespaces can be utilized by making use of PHP 5.3's namespace and 
use keywords. All ZF2 classes have a namespace which directly matches 
Al with the folder structure of the folder holding that class; all classes stored 
= within that folder are directly determined by their namespace. 
Q By default, the use keyword creates an alias for the last segment of 
the namespace, and this can be changed by using the as option on the 
keyword. For example, see the following code: 
use Zend\Form\Element as Element; 
use Zend\Form\Element; // same as previous line 


3. Make necessary changes to the controllers to fetch the instances from 
ServiceManager: 


// to get Login Form 
$form = Sthis->getServiceLocator () ->get('LoginForm!' ) ; 


// to get User Table 
SuserTable = Sthis->getServiceLocator()->get('UserTable'); 


4. To check if the changes are working as expected, try to register and log in with 
new credentials. 


What just happened? 


We have migrated our code to make use of Zend's ServiceManager framework. 
ServiceManager provides enormous benefits in terms of a cleaner code, highly 
effective refactoring ability, and a centralized register for core application components. 





Now that you have understood Zend ServiceManager functionality, here is a simple 

task for you. The login controller (CommunicationApp/module/Users/src/Users/ 
Controller/LoginController.php) makes use of getAuthService() forthe 
authentication service. Modify the function, so that the authentication service is obtained 
from ServiceManger. 


In the previous chapter we learned how to implement a basic database operation, namely, 
table insert. In this section, you will learn all the basic database operations necessary 
for building a simple CRUD (Create, Read, Update and Delete) interface. 
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More on TableGateway 


The TableGateway class extends AbstractTableGateway, which implements 
TableGatewaylInterface. The interface definition of TableGatewayInterface 
is provided in the following code snippet; all the basic table operations are defined 
in the interface: 


interface Zend\Db\TableGateway\TableGatewayInterface 


{ 


} 


public function getTable(); 

public function select (Swhere = null); 
public function insert ($set) ; 

public function update(Sset, Swhere = null); 
public. function delete (Swhere) ; 


The TableGateway Class offers a wide range of methods to perform basic database 
operations; some of the most frequently used methods are explained in the following section: 


+ 


getTable (): Returns a string which contains the table name mapped with the 
TableGateway object. For example, see the following code: 


SmyTableName = SmyTableGateway->getTable() ; 


select (Swhere = null): Used to select a set of rows with the criteria specified 
in Swhere; it can either be a where condition based on Zend\Db\Sql1\Where or an 
array of criteria. For example, see the following code: 


Srowset = SmyTableGateway->select( array('id' => 2)); 


insert ($set): Used to insert the data defined in Sset into the table as a new 
record. For example, see the following code: 


smyTableGateway->insert( array('id'! => 2, 'name'=>'Ravi')) ; 


update (Sset, Swhere = null): Used to update a set of rows with the criteria 
specified in Swhere; it can either be a where condition based on Zend\Db\Sql1\ 
Where or an array of criteria. $set holds the data that will be updated for all the 
records matched with Swhere. For example, see the following code: 


Srowset = SmyTableGateway->supdate(array('name' => 'Jerry') , 
array ("idr => 27); 


delete (Swhere) : Used to delete a set of rows with the criteria specified in 
Swhere; it can either be a where condition based on Zend\Db\Sql\Where 
or an array of criteria. For example, see the following code: 


SmyTableGateway->delete( array('id' => 2)); 
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@ getLastInsertValue(): Returns the last insert value for the table's primary 
key. the return type is an integer. For example, see the following code: 


SmyTableGateway->insert( array('name'=>!'Ravi')); 
SinsertId = SmyTableGateway-> getLastInsertValue (); 


Time for action — implementing an admin Ul to manage users 





In this task we will be creating an administration user interface for managing users in our 
application. The following operations will include listing all users, editing existing users, 
deleting users, and adding users: 


1. Modify CommunicationApp/module/Users/src/Users/Model/UserTable. 
php using the following code. Add the following functions: 


a fetchAll () 
a getUser ($id) 
a getUserByEmail (SuserEmail) 


a deleteUser ($id) 
public function fetchAll () 


{ 


SresultSet = Sthis->tableGateway->select () ; 
return SresultSet; 


public function getUser ($id) 


{ 
Sid. = (int) “Sid; 
Srowset = Sthis->stableGateway->select (array('1id' => $id)); 
Srow = Srowset->scurrent () ; 
if (!Srow) { 
throw new \Exception("Could not find row $id"); 


} 


return $row; 


public function getUserByEmail (SuserEmail) 


{ 


Srowset = Sthis->tableGateway->select (array('email' => 
SuserEmail) ) ; 

Srow = Srowset-scurrent () ; 

if (!$row) 4 


throw new \Exception("Could not find row $ userEmail") ; 
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return Srow; 


public function deleteUser ($id) 


{ 


Sthis->tableGateway->sdelete(array('id' => $id)); 


} 


Create a new controller for user management under CommunicationApp/ 
module/Users/src/Users/Controller/UserManagerController.php. 


The UserManagerController controller will have the following actions: 


a indexAction(): This is used to render all available users in the system, 
and we will also render links to add/edit and delete links as shown in the 
following code: 


SuserTable = Sthis->getServiceLocator () 
->get ('UserTable') ; 
SviewModel = new ViewModel (array ( 
'users' => SuserTable->sfetchAll())); 


return SviewModeli ; 


a editAction(): This action is used to render the edit form to modify the 
information related to the user: 


SuserTable = Sthis->getServiceLocator () 
->get ('UserTable') ; 
$user = SuserTable->getUser ( 
Sthis->params ()->fromRoute('id')); 


$form = Sthis->sgetServiceLocator () 
->get ('UserEditForm') ; 
Sform->bind(Suser) ; 


SviewModel = new ViewModel (array ( 
'form' => Sform, 
'user_id' => Sthis=sparans ()->fromRoute('id') 


PF 


return SviewModel; 


al 


m 
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The bind method 


The bind method used in the Form function allows the mapping of the 
model to a form. The function works in two directions—it updates the form 
in the view with the data from the model and it updates the model with the 
form submission data if the form is validated, that is, SEorm->isValid(). 


Read more here: 


http: //framework.zend.com/manual/2.2/en/modules/zend. 
form.quick-start.html#binding-an-object 


processAction(): The processAction action is used when the user 
edit form is submitted; processAction saves the updated record and 
returns to indexAction: 


// Get User ID from POST 
Spost = Sthis->request->getPost () ; 
SuserTable = Sthis->getServiceLocator () 
->get ('UserTable') ; 
// Load User entity 
$user = SuserTable->getUser (Spost->1d) ; 


// Bind User entity to Form 
Sform = Sthis->getServiceLocator () 
->get ('UserEditForm' ) ; 
Sform->bind(Suser) ; 
Sform->setData(Spost) ; 


// Save user 
Sthis->getServiceLocator () 
->get ('UserTable') ->saveUser ($user); 


deleteAction(): This action is used to delete the user record: 


Sthis->getServiceLocator()->get ('UserTable' ) 
->deleteUser (Sthis->params () 
->fromRoute('id')); 


4. Create the necessary views and modify the module's config/module.config. 
php file to specify a unique child route to access this controller: 


'user-manager! => array ( 
‘type! => 'Seqment’, 
'options' => array ( 
'route'! => '/user-manager[/:action[/:id]]', 
'constraints' => array ( 
‘action! ==. 1 la-ZA=4) laza =] e4, 
'id' => 1 la=ZA=2049 =|%%, 


— [BD] NNMAMlLLlLcc—t____—_ 
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ie 


'defaults!' => array ( 
'controller' => 'Users\Controller\UserManager', 
faction! => 'index', 


) 
) 


5. Finally add the new controller to the invokables array: 


'Users\Controller\UserManager' => 'Users\Controller\ 
UserManagerController', 


6. Now open your web browser and access the controller, log in to your application, 
and open http://comm. -app.local/users/user-manager. You should be 
able to see a page similar to the one given in the following screenshot: 


Users N 


Name User ID/Email 

Test User test@localhost.com it | Delete 
Anne Hunter anne.hunter@mail.com it | Delete 
Jake Bower jake.bower@mail.com it | Delete 
Abigail Morgan abigail.morgan@mail.com Delete 
Rachel Wright rachel.wright@mail.com it | Delete 
Benjamin Abraham benjamin.abraham@mail.com it | Delete 
Grace Springer grace.springer@mail.com it | Delete 
Piers Mitchell piers.mitchell@mail.com Delete 


Leonard Davidson leonard.davidson@mail.com it | Delete 
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The Edit user link should redirect you to an user edit form like the one in the 
following screenshot: 


Edit User Information 


Full Name 


Jake Bower 


Email 


jake. bower@mail.com 


| Save | 
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The Delete user link can be used to remove the user from the user list: 


Users 


Name User ID/Email 

Test User test@localhost.com Edit | Delete 
Anne Hunter anne. hunter@mail.com Edit | Delete 
Jake Bower jake. bower@mail.com Edit | Delefe 


Abigail Morgan Edit | Delete 
Confirm from Web Page 





Rachel Wright | Edit | Delete 


Benjamin Abraham (?) sce tenia Edit | Delete 


Grace Springer | Edit | Delete 


C em 
Piers Mitchell eee) 


Leonard Davidson leonard.davidson@mail.com Edit | Delete 





Edit | Delete 
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What just happened? 


We have now created an administration user interface for adding, modifying, and removing 
users from our communication application. We have utilized all the core functionalities of 
the TableGateway model and created functions for performing CRUD operations on the 
table access objects. 


Going forward, we will be making use of some of the more advanced applications 
of TableGateway. 


Before we move on to the next section, here is a small task for you to practice. Your task for 
this section will be to create a new Add User form. Refer to the following screenshot: 


Jake Walsh jake.walsh@mail.com Delete 
Andrea Slater andrea.slater@mail.com Delete 
Sean Powell sean.powell@mail.com Delete 


Adrian Arnold adrian.arnold@mail.com Delete 





Gavin Miller gavin.miller@mail.com Delete 


N 


» Add User 


Register 





This form will be similar to the Register Form that we created in the previous chapter. 
Once the form is submitted, the user will be taken back to the user listing page. A link to this 
form will have to be added in the user listing page. 
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In this section we will create a new document management interface. The document 
management interface will allow users to upload documents, manage uploads, and share 
uploaded documents with other users. The user interface will also allow users to manage 
sharing, and add/remove shares. 


In this section, we will focus on providing users with options to create file uploads and 
manage those uploads. We will be using the filesystem to store the uploaded file and the 
relative path of the uploaded file will be stored in the database mapped to the user who 
uploaded the file. 


Some of the important Zend Framework components used in file uploads are: 


@ File upload form element (Zend\Form\Element\File): The File upload element 
is used in the upload form to display a file input box. This element is an equivalent of 
the <input type='file'../> style element in HTML used for allowing users to 
upload files. The file input element can be rendered by setting 'type' => 'file' 
in the form definition. 


@ File transfer adapter (Zend\File\Transfer\Adapter\Http): The file transfer 
adapter handle file uploads upon form submission. The setDestination () 
method in the file transfer adapter allows the user to set a destination and receive 
the file in that destination. The receive () method is used to initiate the transfer. 


Time for action — creating a file upload form 





In this task, we will be creating a new document upload form; file uploads will be stored in 
the filesystem, and the information regarding the file upload will be stored in the database 
in a table named uploads. The file uploads are stored in a folder location defined in the 
module configuration. Perform the following steps to do so: 


1. Our first step will be to define a location where files can be uploaded in the 
module's configuration (config/module. config. php): 
<?php 
return array ( 
// Other configurations 
ii 
ig) 
// MODULE CONFIGURATIONS 
module. config! => array | 
‘upload location” => DIR. 2 '/../data/uploads', 
a 
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2. Next, we need to create a table which will store the upload information: 


CREATE TABLE IF NOT EXISTS uploads ( 
id INT NOT NULL AUTO INCREMENT PRIMARY KEY , 
filename VARCHAR( 255 ) NOT NULL , 
label VARCHAR( 255 ) NOT NULL , 
user id INT NOT NULL, 
UNIQUE KEY (filename) 
) 


3. Create the Upload and UploadTable classes for interacting with the uploads 
table. Add default methods such as saveUpload(), fetchAll1(), getUpload(), 
and deleteUpload(). Also, add a method to get uploads made by a specific user 
getUploadsByUserlId(SuserId): 


public function getUploadsByUserId (SuserId) 


{ 


SuserlId = (int) SuserId; 
Srowset = Sthis->tableGateway->select ( 
array ("user 1d! => Suserid).)% 


return Srowset; 


} 


4. Create an UploadManagerController controller for managing file uploads. Add 
indexAction() to display the list of uploads done by the user: 


SuploadTable = Sthis->getServiceLocator () 

->get ('UploadTable') ; 
SuserTable = Sthis->getServiceLocator () 

->get ('UserTable') ; 
// Get User Info from Session 


SuserEmail = Sthis->getAuthService () 

->getStorage () ->read() ; 
$user = SuserTable->getUserByEmail (SuserEmail) ; 
SviewModel = new ViewModel( array ( 


'myUploads' => SuploadTable->getUploadsByUserId(Suser->1d), 
BE 


return SviewModeli ; 
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5. Create an upload form with a file input as described in the following code snippet: 


Sthis->add (array ( 


'name' => 'fileupload', 
‘attributes! => array ( 
‘type’ => ‘rile’, 

F 
'options' => array ( 


'label' => 'File Upload', 


ya, 
rT aT aa = 


p A 
=, rala AU T aE e = TEA 
wie uUniICation Appilcatio Home 


Upload 


File Description) Sample Document 


File Upload | Choose File | Sample Pdf 


Upload Now | 


` 
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Upload form 


6. Create views for the file upload form, and the index action. Now we have all the 
necessary elements to handle a file upload. We need to read the configuration for 
the file upload path and use the Zend HTTP file transfer adapter to receive the file 
in the configuration location. The get ('config') method on the service locator is 
used to retrieve the configuration. The following code is used to read the file upload 
location from the configuration: 


public function getFileUploadLocation () 


{ 


// Fetch Configuration from Module Config 
Sconfig = Sthis->getServiceLocator()->get('config') ; 
return Sconrtig|' module contig") |"upload location" |; 


} 


[731 


Data Management and Document Sharing 


7. The last step is to handle the file upload process. There are two actions that need to 
happen once the form is successfully submitted: 


1. The uploaded file has to be moved to the file upload locations. 


2. An entry needs to be added describing the upload in the 'uploads' table 
using the following code: 


SuploadFile = Sthis->params()->fromFiles('fileupload') ; 
Sform->setData (Srequest->sgetPost ()); 


if (Sform->isValid()) { 
// Fetch Configuration from Module Config 
SuploadPath = Sthis->getFileUploadLocation() ; 


// Save Uploaded file 
Sadapter = new \Zend\File\Transfer\Adapter\Http() ; 
Sadapter->setDestination(SuploadPath) ; 
if (Sadapter->receive (SuploadFile['name']) ) { 
// File upload sucessfull 
Sexchange data = array()j; 


Sexchange data['label'] = Srequest->getPost () 

->get ('label') ; 
Sexchange data['filename'] = SuploadFile['name'] ; 
Sexchange data['user id'] = Suser->1id; 


Supload->exchangeArray (Sexchange data) ; 
SuploadTable = Sthis->getServiceLocator () 

->get ('UploadTable') ; 
SuploadTable->saveUpload(Supload) ; 


return Sthis->redirect () 
->toRoute('users/upload-manager' , 
array('action' => 'index' 


yes 


} 


8. Add a child route (upload manger) for the UploadManager controller and the 
controller to the invokables list. 


9. Open the web browser and test the upload form. 
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The final form will look like the following screenshot: 


a, F B 

1 Fa pma jan r Cal an AAR Cal = p 
] j | ] — 11 i fi 

ie | L. ee a a i 1 inl ee a a S A A 


My Uploads 


Label Filename 


Corporate Report Sample.Pdf 


» Add Upload 
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What just happened? 


We have now created a file upload process, which allows users to upload files into the 
application and view the files that are uploaded. We have used Zend Framework's file upload 
handling components to handle a file upload. In our next section, we will set up a file sharing 
mechanism such that the documents can be shared with different users. Before we move on 
to implement file sharing, please complete the following task. 


Your next task will be to add a Delete option that allows users to delete uploaded files as 
shown in the following screenshot. Also, ensure that the file is removed from the filesystem 
when the delete action is triggered. 


My Uploads 


Label Filename Actions 


Corporate Report Sample.Padf Delete 
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Now that we have a fully functional document management section, our next task is to extend 
this document management system to support file sharing with other users. The most important 
part of implementing a file sharing mechanism is to store the information about upload sharing; 
we do this by linking documents with user IDs in a table called upload_sharing. 


Time for action — implementing a file sharing system 





For implementing file sharing, we will need to create a new table called upload_sharing 
and store all sharing-related information in that table. The following steps will explain how 
this is implemented in our application: 


1. 


Create a new table called upload_ sharing; this table will hold the relationship 
about uploads shared with users: 
CREATE TABLE IF NOT EXISTS uploads sharing ( 
id INT NOT NULL AUTO INCREMENT PRIMARY KEY , 
upload id INT NOT NULL , 
user id INT NOT NULL, 
UNIQUE KEY (upload_id, user id) 
I3 


In the module definition Module . php, add a simple TableGateway object for the 
uploads sharing table: 
'UploadSharingTableGateway' => function ($sm) { 

SdbAdapter = S$sm->get('Zend\Db\Adapter\Adapter') ; 

return new TableGateway('uploads sharing', SdbAdapter) ; 


hi 


Modify the constructor of the UploadTab1le class to take in an additional 
parameter of the upload sharing TableGateway object: 


public function construct (TableGateway StableGateway, 
TableGateway SuploadSharingTableGateway) 


Sthis->tableGateway = StableGateway; 
Sthis->uploadSharingTableGateway = SuploadSharingTableGateway; 


} 


Modify the module configuration (Module. php) for the UploadTable factory to 
support UploadSharingTableGateway: 


'UploadTable' => function(Ssm) { 
StableGateway = $sm->sget ('UploadTableGateway') ; 
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SuploadSharingTableGateway = Ssm->get ('UploadSharingTableGatew 
ay he 

Stable = new UploadTable(StableGateway, 
SuploadSharingTableGateway) ; 

return Stable; 


hy 


Modify the UploadTable class to support the following file sharing functions: 


a addSharing(): Adds anew sharing permission for the given upload with 
the user 


a removeSharing(): Removes the sharing permission for the specific 
upload/user combination 


a getSharedUsers (): Gets the list of users for which the upload is shared 


a getSharedUploadsForUserId(): Gets the list of uploads that are shared 
for that user 


This can be done using the following code: 


public function addSharing(SuploadiId, SuserId) 


{ 


Sdata = array ( 

'upload_id' => (ant) Suploadid, 

ruser 10" =e “int )Suserid; 
NG 
Sthis->uploadSharingTableGateway->insert ($data); 


public function removeSharing(Suploadid, SuserId) 


{ 


Sdata = array ( 

'upload_id' => (int) Suploadid, 

"user id" => (int) Suserid, 
E 
Sthis->uploadSharingTableGateway->delete(Sdata) ; 


public function getSharedUsers (SuploadId) 


{ 
SuploadId = (int) Suploadid; 
Srowset = Sthis-suploadSharingTableGateway->select ( 
array ('upload_id' => SuploadId) ) ; 
return Srowset; 
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} 


public function getSharedUploadsForuUserlId (SuserId) 


{ 


} 


Suserld = (int) Suserld; 


Srowset = Sthis-suploadSharingTableGateway->select ( 
function (Select Sselect) use (SuserId) { 
Sselect->columns (array () ) 
->where (array('uploads sharing.user_ id'=>SuserlI1qd) ) 
->join('uploads', ‘uploads sharing.upload_id = uploads.id') ; 


b); 


return Srowset; 


The Manage Documents section lists all uploads for a specific user and also lists 
uploads shared by others with the user: 


My Uploads 


Label Filename Actions 


Corporate Report Sample.Pdf Edit | Delete 


Shared Uploads 


Label Filename Shared By 


» Add Upload 
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6. Modify the edit upload form to display the list of users the upload is shared with; 
this can be achieved by passing the upload ID to the getSharedUsers () method of 
the UploadTab1le object. 
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7. Add anew section in the edit upload form which allows the addition of new 
shares; this is achieved by displaying the list of all users in the system in a 
drop-down list. When the user clicks on Add Share, a new record is added 
to the upload_sharing table: 


SuserTable = Sthis->getServiceLocator () 
->get ('UserTable') ; 
SuploadTable = Sthis->getServiceLocator () 
->get ('UploadTable') ; 
$form = Sthis->sgetServiceLocator ()->get ('UploadForm' ) ; 
Srequest = Sthis->getRequest () ; 
if (Srequest->isPost()) { 
SuserId = Srequest->getPost()->get('user id'); 
Suploadid = Srequest->getPost()->get('upload_id') ; 
SuploadTable->addSharing(Suploadid, SuserId) ; 


} 


The following screenshot shows the Upload Sharing page with a drop-down list to 
add shares: 





Upload Sharing 


Shared User Actions 


Abigail Morgan Delete 


Add Sharing 





Choose User: Test User 











Add Share 
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8. The last section of the file sharing implementation is to allow an option for users to 
download shared files. This is provided by the £ileDownloadAction() function 
defined in our file sharing application: 


public function f1leDownloadAction () 
{ 
SuploadiId = Sthis->params()->fromRoute('1id') ; 
SuploadTable = Sthis->getServiceLocator () 
->get ('UploadTable') ; 
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Supload = SuploadTable->getUpload(SuploadId) ; 


// Fetch Configuration from Module Config 
SuploadPath = Sthis->getFileUploadLocation() ; 
$file = file get _contents(SuploadPath ."/" . Supload->filename) ; 


// Directly return the Response 

Sresponse = Sthis->getEvent () ->getResponse () ; 

Sresponse->getHeaders () ->addHeaders (array ( 
'Content-Type' => 'application/octet-stream', 
'Content-Disposition' => ‘attachment; filename="' 
.Supload->filename . '"', 


pa 


Sresponse->setContent ($file) ; 


return Sresponse; 


File download 


For implementing a file download, we need to disable the layout. This can be 
achieved by directly providing the HTTP response object as output for that 
particular action as shown in the previous code. This can also be achieved by 
setTerminal (), as shown in the following code: 


A! Sresult = new ViewModel(); 


Sresult->setTerminal (true) ; 
return Sresult; 


Large file downloads 


The file get contents () method is capable of handling small file 
uploads and consume a lot of memory when processing large files. For 
better performance, you can create a stream HTTP response object Zend \ 
Http\Response\Stream() and stream the file download. 


9. Now we have a fully functional file sharing system in place. Test the file 
sharing system; start by sharing the file with different users, and log in 
and out as different users. 
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The final form should look like the following screenshot: 


My Uploads 


Label Filename Actions 


Shared Uploads 


Label Filename Shared By 
Corporate Report Download Gavin Miller 


Sales Report Download Anne Hunter 


» Add Upload 
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What just happened? 


You created a table that can store user and upload relationships; you modified the 
UploadTable class to support additional sharing functions. You created controllers and 
views to enable file sharing, and finally you provided the ability for the user to download the 
shared file using a file download script. With this, you have successfully implemented the file 
sharing system, where users can now upload, edit, and share documents within the system. 





Q1. In TableGateway, which function is used to determine the last inserted record ID? 


1. 
2. 
3: 
4. 


Q2. Which method can be used to disable layouts in a view model? 


1. 
2: 
3. 
4. 


getLastId() 
getLastInsertId () 
gett last ansert. ad") 


getLastInsertValue () 


SviewModel->setNoLayouts (true) 
$ viewModel->Layouts (false) 
SviewModel->setTerminal (true) 


SviewModel->setLayouts (false) 
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Summary 


In this chapter, we have discussed several topics in the context of data and file management. 
First, we elaborated on the usage of the TableGateway database pattern. We then 
implemented a simple file upload service by making use of Zend Framework's file transfer 
components. Finally, we implemented a simple file sharing service by utilizing both Zend 
Framework's file transfer components and the TableGateway pattern. In the next chapter, 
we will be working closely on the frontend, especially with JavaScript and AJAX calls. 
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In any web application development, there will be very high dependency on 
client-side scripts primarily including JavaScript and CSS. The MVC model of 
Zend Framework provides basic support of controlling the output that is sent 
across to the browser. The view helper classes in Zend Framework 2 offer 
maximum control over the content that gets rendered in the client browser. 





In this chapter we will focus on building a simple group chat and e-mail component which 
will make use of various frontend capabilities of Zend Framework 2.0. Some of the important 
topics covered in this chapter include: 


Using external JavaScript libraries in the Zend Framework 2 application 


Implementing a simple group chat application using Zend Framework 2 
and JavaScript 


Using Zend\Mail to send e-mails 


Introduction to the Zend Framework event manager 


Layouts and views 


Zend Framework MVC uses layouts and views to render pages in the web browser; the 
overall page content is controlled by the layout specification, and the view level information 
is contained in the views. The concept is to minimize the amount of redundant HTML code 
that needs to be generated for each of these views. 


By using layouts, the application can have a consistent user interface, which is also easy 
to customize; the views offer the flexibility to modify the targeted content and allow 
customization to the maximum possible extent. This is also known as two-step view. 
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When a new view is generated, the appropriate layout is identified from the layout 
definitions in the view manager configuration and the view is rendered with that layout. 


. FOOTER «4 ¢ 
</HTML> 





The preceding schematic explains how the layout and view are combined to form an HTML 
page, so for each and every view, the view part changes and the layout part remains static. 


Zend Framework 2 offers a wide range of view helpers that help us perform complex 
operations on views; if the included helpers are not sufficient, you can define your own 
custom helper by implementing the interface Zend\View\HelperInterface. 


In this section, we will quickly review some of the included helpers in Zend Framework 2. 


The URL helper 


The syntax for this helper is url ($name, SurlParams, SrouteOptions = array(), 
SreuseMatchedParams = array()). 


The URL helper is used to generate the URL for a specific route. The route's segment match 
parameters can be passed over the URL helper to form a URL based on the route option; for 
example, see the following: 


<a href="<?php S$this->url('users/upload-manager', 
array ('action'=>'edit', 'id' => 10));">Edit</a> 


This code will generate <a href="/users/upload-manager/edit/10">Edit</as if 
the route definition is as follows: 


'route' => '/user-manager[/:action[/:id]]' 


[84] 


Chapter 5 


The BasePath helper 


The syntax for this helper is basePath(). 


The BasePath helper returns the base URL of the view, this can be used by developers to 
prepend to their custom URLs and form links for various resources. 


The JSON helper 


The syntax for this helper is json ($jsonData = array()). 


The JSON helper is used to render PHP arrays as JSON-encoded data. Most AJAX libraries 
classify JSON content by its content header, and this helper also sets the content type header 
to application/json. 


Zend Framework makes use of placeholder helpers to perform some standard operations on 
the HTML head sections including adding/removing references to new JavaScript libraries, 
linking with new styles, adding and cross referencing scripts, and adding/removing HTML 
head section's meta content. 


This is achieved by the following list of helpers called as concrete placeholder helpers. The 
reason why they are called placeholder helpers is because the helpers themselves don't make 
any changes to the way in which the content is rendered. For example, if you add <?php 
echo $this->headLink(); ?>tothe HTML code, this won't do anything, until you add 
something to the headLink helper by using aopendStylesheet or some other function. 


The HeadLink helper 


The HeadLink helper is used to modify the <link> tag in the HTML head section; this 
helper is used to attach or manage external CSSs. 


Some of the most-used functions in this helper are listed as follows: 


@ appendStylesheet ($href, Smedia, SconditionalStylesheet, Sextras) 


@ offsetSetStylesheet (Sindex, Shref, Smedia, 
SconditionalStylesheet, Sextras) 


@ prependStylesheet ($href, Smedia, SconditionalStylesheet, 
Sextras) 


@ setStylesheet ($href, Smedia, SconditionalStylesheet, Sextras) 
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To render the Link tags in an HTML layout/view, use the following script: 
J. 


<?php echo Sthis->headLink(); ?> 


The HeadMeta helper 


The HeadMeta helper is used to modify the <meta> tag in the HTML head section; this 
helper is used to manipulate the HTML meta information. 


Some of the most-used functions in this helper are listed as follows: 


+ 
+ 
+ 
+ 
+ 
+ 


+ 


appendName (SkeyValue, $content, $conditionalName) 
offsetSetName ($index, SkeyValue, $content, SconditionalName) 
prependName ($keyValue, $content, SconditionalName) 

setName ($keyValue, $content, Smodifiers) 

appendHttpEquiv ($keyValue, $content, SconditionalHttpEquiv) 


offsetSetHttpEquiv(Sindex, SkeyValue, $content, 
SconditionalHttpEquiv) 


prependHttpEquiv(SkeyValue, Scontent, SconditionalHttpEquiv) 
setHttpEquiv(SkeyValue, $content, Smodifiers) 


setCharset (Scharset) 


To render the meta tags in an HTML layout/view, use the following script: 
f 


<?php echo $this->headMeta(); ?> 


The HeadScript helper 


The HeadScript helper is used to modify the <script> tag in the HTML head section; this 
helper is used to attach external JavaScript and also add the <script> tags to the HTML 
head section. 


Some of the most-used functions in this helper are listed as follows: 


+ 


appendFile($src, $type = 'text/javascript', Sattrs = array ()) 
offsetSetFile(Sindex, S$src, $type = 'text/javascript', Sattrs = 
array () ) 

prependFile(S$src, $type = 'text/javascript', Sattrs = array()) 
setFile(Ssrc, $type = 'text/javascript', Sattrs = array()) 
appendScript (Sscript, $type = 'text/javascript', Sattrs = 
array () ) 
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@ offsetSetScript (Sindex, Sscript;, $type = 'text/javascript', 
Sattrs = array()) 

@ prependScript ($script, $type = 'text/javascript', Sattrs = 
array ()) 

@ setScript(Sscript, $type = 'text/javascript', Sattrs = array()) 


To render the Script tags in an HTML layout/view use the following script: 
fa <?php echo $this->headScript(); ?> 


The HeadStyle helper 
The HeadStyle helper is used to modify the <style> tag in HTML head section; this helper 
is used to add internal styles by adding the <style> tags to the HTML head section. 


Some of the most-used functions in this helper are listed as follows: 


@ appendStyle(Scontent, Sattributes = array ()) 

@ offsetSetStyle(Sindex, $content, Sattributes = array ()) 
@ prependStyle(Scontent, Sattributes = array ()) 

@ setStyle(Scontent, Sattributes = array ()) 


To render the Style tags in an HTML layout/view use the following script: 
Ji <?php echo Sthis->headStyle(); ?> 


The HeadTitle helper 


The HeadTitle helper is used to render title in the <title> tags on the HTML head 
section; multiple calls to a headTitle() helper create a list of titles which are rendered 
when tag is outputted in the layout/view. The optional parameter Sset Type can be set 
to override the pre-existing array of titles, the default is APPEND, it can be overridden to 
PREPEND or SET(overwrite). 


The syntax for this helper is headTitle ($title, S$setType = null) ,;. 


To render the Title tags in an HTML layout/view, use the following script: 
fa <?php echo $this->headTitle(); ?> 
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Time for action — using jQuery Ulin a simple page 


In this task we will be converting some of our existing pages to make use of the jQuery Ul 
library and render buttons in that page using jQuery UI: 





1. View the existing application home page as shown in the following screenshot; our 
next task is to convert the Login and Register links to render as jQuery UI buttons: 


Welcome to Users Module 
Existing Users 


Login 


New Users 


Register 
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Existing application home page 


2. Replace the Login and Register links in the index view (module/Users/view/ 
users/index/index.html), and add the ui-button class to the links as shown 
in the following code snippet: 


<a href="/users/login" class='ui-button' >Login</a> 
<a href="/users/register" class='ui-button'>Register</a> 


3. Add external references to jQuery UI towards the beginning of the view: 
// Attached jQuery UI Scripts 
Sthis->headScript () 


->appendFile('http://code.jquery.com/jquery-1.8.3.js', 'text/ 
jJavascript'); 


Sthis->headScript () 
->appendFile('http://code.jquery.com/ui/1.10.0/jquery-ui. 
js! text/javascript); 


// Attach jQuery UI Styles 


$this->headLink () ->appendStylesheet ('http://code.jquery.com/ 
ui/1.10.0/themes/base/jquery-ui.css'); 
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Referencing custom JavaScript libraries 
JI Instead of directly referencing the external scripts, you can also optionally 
` download the scripts to the /public folder in your application and pass 
Q relative links as parameters to the appendFile and appendStylesheet 
functions. You can also make use of the basePath () helper to prepend the 
base URL. 


4. Adda Ul initialization script to apply the button look and feel to both the links: 


jf UI Initializer for buttons 
Sthis->headScript ()->appendScript ( 
'$(function() { 
S("a.ui-button") «button |). 
hb) eo 'text/javascript'); 


5. Preview the home page in the browser now, and you will be able to see that 
both the Login and Register buttons are styled using jQuery UI as shown in 
the following screenshot: 


Welcome to Users Module 


Existing Users 


Login 


New Users 


Register 
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A View Source link on the index page will reveal the application of headScript () as shown 
in the following code: 


<!DOCTYPE html> 
<html lang="en"> 


<script type="text/javascript" src="http://code.jquery.com/jquery- 
1.8.3.js"></script> 

<script type="text/javascript" srco="http://code.jquery.com/ui/1.10.0/ 
jquery-ui.js"></script> 

<script type="text/javascript"> 


Co 
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Ss (function() { 
$("a.ui-button").button(); 
DE 

i 


</script> 
</html> 


What just happened? 


We have made use of Zend Framework's view helpers to connect to the external 
JavaScript library; we then added custom JavaScript to the HTML head section 
using the headScript () view helper. 


Now we have integrated our application with an external JavaScript; in the next exercise we 
will learn a little bit more on how scripts can be added to the HTML head section. 


Before we move on to building the Group Chat interface, here is a simple task for you to 
complete. Now that you have understood how to link external JavaScript libraries, you can 
download jQuery UI from its website, extract it to the public/ folder, and modify the 
previously listed page to use the downloaded version of jQuery Ul. 


jQuery Ul can be downloaded from http://jqueryui.com/. 


Our next task is to build a simple group chat application that allows multiple users to log in to 
our system and chat with each other. The backend for this tool is pretty straightforward. We 
need to create a table that will store all user messages and render them in a separate view; 
we will create a simple form that will allow users to send messages. 


Time for action — creating a Simple group chat application 


1. Create anew chat messages table to store all user messages: 





CREATE TABLE IF NOT EXISTS chat messages ( 
id INT NOT NULL AUTO INCREMENT PRIMARY KEY , 
user id INT NOT NULL, 
message VARCHAR( 255 ) NOT NULL , 
stamp TIMESTAMP DEFAULT CURRENT TIMESTAMP 
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2. Create a controller for group chat in Communicat ionApp/module/Users/src/ 
Users; Controller/GroupChatController, php, 


3. Make necessary changes to CommunicationApp/module/Users/config/ 
module.config.php and add the new controller to invokables and routes: 


// Invokable 
'Users\Controller\GroupChat" => 'Users\Controller\ 


GroupChatController', 
// Route 
'group-chat' => array ( 
'type'! => 'Segment', 
'options' => array ( 
'route'! =>. "/group=Chat |/ vaction|/*id)] 1", 
'constraints' => array ( 
bacevon” sa [a= ZASZ| [aR zA 209. =) 44, 
vig)! =s Cja=ZA-20=9 =]* 
E; 
'defaults' => array ( 
'controller' => 'Users\Controller\GroupChat', 
'action' => 'index', 


) 
) 


4. Create a new view in CommunicationApp/module/Users/view/users/group- 

chat/index.phtml: 
<?php 
Sthis->headScript ()->appendScript ( 
'$(function() { 

S( "#btnRefresh" ) 

.click(function( event ) { 
document .getElementBylId("messageListFrame") .contentWindow. 

location.reload(true) ; 


}) 


tae 'text/javascript") + 


Sthis->sheadStyle()->appendStyle(' 
#userName { width:100px; margin-top:10px; display: inline} 
#messageText { width:700px; margin-top:10px; } 

EE 


?> 
<h3>Group Chat</h3> 
<iframe src="<?php echo $this->url('users/group-chat', array ( 
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'action' => 'messageList' 
)) 2S" width="803" height="400px" 
id="messageListFrame"></iframe> 


<?php 
// Render the opening tag 
echo Sthis->form() ->openTag(Sform) ; 


// ...loop through and render the form elements... 
echo '<label id="userName">'. SuserName .': </label>'; 
foreach (Sform as Selement) { 
echo Sthis->formElement (Selement) ; // <-- Magic! 
echo Sthis->formElementErrors (Selement) ; 


// Render the closing tag 
echo Sthis->form() ->closeTag() ; 


?> 


Add the messageList action to GroupChatController - 
CommunicationApp/module/Users/src/Users/Controller/ 
GroupChatController.php; this action will query the chat_ messages table 
and get all the records from that table and pass that on to the view: 


public function messageListAction () 
{ 
SuserTable = Sthis->getServiceLocator()->get('UserTable') ; 
SchatMessageTG = Sthis->getServiceLocator ()->get ('ChatMessagesTa 
bleGateway') ; 
SchatMessages = SchatMessageTG->select () ; 


SmessageList = array() ; 

foreach($chatMessages as $chatMessage) { 
SfromUser = SuserTable->getUser (SchatMessage-suser id); 
SmessageData = array() ; 
SmessageDatal['user'] = SfromUser->name; 
SmessageDatal['time'] = SchatMessage->stamp; 
SmessageData['data'] = SchatMessage->message; 
SmessageList[] = SmessageData; 

} 

SviewModel = new ViewModel (array('messageList' => 

SmessageList) ) ; 


SviewModel->setTemplate('users/group-chat/message-list'); 
SviewModel->setTerminal (true); 
return SviewModeli ; 
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Create a simple message listing view, CommunicationApp/module/Users/view/ 
users/group-chat/message-list.phtml, which will list messages from the 
SmessageList array: 


<!DOCTYPE html> 
<html lang="en"> 
<body> 
<section id="messages" > 
<?php foreach (SmessageList as şmesg) : ?> 
<div class="message" style="clear:both;"> 
<Span class='msg-time'> 
[<?php echo Sthis->escapeHtml ($mesg['time']);?>] 
</span> 
<span class='msg-user'> 
<?php echo Sthis->escapeHtml (Smesg['user']);?>: 
</span> 
<span class='msg-data'> 
<?php echo Sthis->escapeHtml (Smesg['data']) ;?> 
</span> 
</div> 
<?php endforeach; ?> 
</section> 
</body> 
</html> 


Create a method called sendMessage (), which is called when a user sends a 
message to store the message in the database, as shown in the following code. 

This needs to be placed in the group chat controller Communicat ionApp/module/ 
Users/src/Users/Controller/GroupChatController.php. 


protected function sendMessage(SmessageTest SfromUserId) 
{ 
SchatMessageTG = Sthis->getServiceLocator () 
->get ('ChatMessagesTableGateway') ; 
Sdata = array ( 
'user- id" => SiromUserid; 
'message' => SmessageTest, 
'stamp' => NULL 
i 
SchatMessageTG- >insert ($data); 
return true; 
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8. Modify the indexAction function to display a Send Message form and to call 
sendMessage() on form submission. This needs to be placed in the group chat 
controller CommunicationApp/module/Users/src/Users/Controller/ 
GroupChatController.php. 


public function indexAction ( 
{ 
$user = Sthis->getLoggedIinuser () ; 
Srequest = Sthis->getRequest () ; 
if (Srequest->isPost()) { 
SmessageTest = Srequest->getPost ()->get('message') ; 
SfromUserId = Suser->1d; 
Sthis->sendMessage (SmessageTest, SfromUserId) ; 
// to prevent duplicate entries on refresh 
return S$this->redirect () ->toRoute('users/group-chat') ; 


//Prepare Send Message Form 
Storm = new \Zend\Form\Form() ; 


Sform->add (array ( 


'name' => 'message', 
‘attributes! => array ( 
‘Cype®* => 'text', 
'id' => 'messageText', 
'required' => 'required' 
E 
'options' => array ( 
'label' => 'Message', 


i, 
Lips 


Sform->add (array ( 


'name' => 'submit', 

'attributes! => array ( 
'type' => 'submit', 
'value' => 'Send' 


ye 
has 


Sform->add (array ( 


name! => "refresh", 
‘attributes! => array ( 
'type' => 'button', 


rid! => 'btnRefresh', 
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'value' => 'Refresh' 


SviewModel = new ViewModel (array('form' => $form, 
'userName!' => Suser-sname) ) ; 
return SviewModeli ; 


} 


9. To test the changes, log in to the browser from two different computers or two 
different browsers using different credentials, and test the Group Chat interface. 


[2013-01-27 01:00:16] Test User: Hi 
[2013-01-27 01:08:38] Test User: This is a test message 
[2013-01-27 10:58:44] Anne Hunter: Hello 


[2013-01-27 10:59:58] Jake Walsh: Hi Anne, How are you? 
[2013-01-27 11:00:32] Anne Hunter: I am doing great ... how are you Jake? 


Jake Walsh: | am good | Send || Refresh 








What just happened? 


We have now successfully implemented a Group Chat interface using Zend Framework; the 
interface is effective for multiple people chatting with each other in a group. Our next task 
will need to build a mechanism to send e-mails to other users in the system; for that we will 
be exhaustively using the Zend Framework's mailing capabilities. 





Here is a simple exercise for you to try before you move on to the next section. In the Group 
Chat interface, we have a Refresh button that reloads the iframe tag. Write some JavaScript 
and attach it to the view, which will reload the IFrame every five seconds. 


Zend Framework offers the Zend\Mail library to send and receive e-mails. In this section, 
we will cover the basics of Zend Framework's mailing capabilities, and will also implement a 
simple mailing script. 
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Zend\Mail supports both plain text and MIME complaint multipart e-mail messages. The 
framework by default supports Sendmail, SMTP, and File transports; new transports can be 
implemented using Zend\Mail\Transport\TransportInterface. 


Zend\Mail\Transport 
The Mail transport is used to send the e-mail message to recipients; Zend\Mail supports 
the following transports: 
@ Sendmail using Zend\Mail\Transport\Sendmail 
@ SMTP using Zend\Mail\Transport\Smtp 
@ File Transport using Zend\Mail\Transport\File 
The Mail transport implements the send () method; this method accepts an object of type 


Zend\Mail\Message as the parameter; this object (Zend\Mail\Message) contains all the 
necessary information for an e-mail message; the message is sent using the transport. 


Zend\Mail\Message 


Zend\Mail\Message is used to compose the mail message in Zend Framework; this object 
takes various parameters including the from address, to address, subject, and body. If the 
message is a MIME complaint multipart message, then the body of the message can be set 
to a Zend\Mime\Message mail message object using the setBody () method, and the 
message can be sent. Some of the most frequently-used methods in Zend\Mail\Message 
are listed as follows: 


setFrom () 
setHeaders 

setTo () 
addCc() and addBec () 


setSubject () 
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setBody () 


Zend\Mime\Message and Zend\Mime\Part 


For sending HTML or multi-part content, each message part is defined as a Zend\Mime\ 
Part object along with its type and associated to the Zend\Mime\Message object using 
the setParts() method. The Zend\Mime\Message object is assigned to the Zend\Mail\ 
Message object using the setBody () method. 
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Time for action — creating a Simple e-mail form 


In this activity, we will be creating an e-mail form making use of Zend's mailing capabilities: 





1. Create a simple e-mail form with input fields for subject, message content, 
and addressee. 


2. Setup anew controller to display the form and write the necessary views. 


3. Modify the controller so that it references the Zend\Mail namespace. 


use Zend\Mail; 


4. Create a new controller method that does the actual e-mailing; this can be placed 
within our group chat controller (Communicat ionApp/module/Users/src/ 
Users/Controller/GroupChatController.php) using the following code: 


protected function sendOfflineMessage (SmsgSubj, 
SmsgText, SfromUserId, StoUserId) 


SuserTable = Sthis->getServiceLocator () 
->get ('UserTable') ; 


SfromUser = SuserTable->getUser (S$fromUserlId) ; 
StoUser = SuserTable->getUser (S$toUserlId) ; 


Smail = new Mail\Message() ; 
Smail->setFrom(SfromUser-semail, SfromUser-sname) ; 
Smail->saddTo(StoUser-semail, StoUser-sname) ; 
Smail->setSubject (SmsgSubj) ; 

Smail->setBody (SmsgText) ; 


Stransport = new Mail\Transport\Sendmail () ; 
Stransport->send($mail) ; 


return true; 


The Sendmail transport (Zend\Mail\Transport \Sendmail) is 
available in Linux by default and can be used for sending e-mail messages. 
Windows users can make use of SMTP transport (Zend\Mail\Transport \ 
È Smtp) to connect an SMTP server to send e-mail messages. The following 
Q reference link provides a quick example on using SMTP transport: 


https://packages.zendframework.com/docs/latest/ 
manual/en/modules/zend.mail.transport.html#zend-mail- 
transport-quick-start-smtp-usage 
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5. Preview the form in a web browser and test if the e-mail is being received; a 
message similar to the following one would be received by the recipient: 


send Offline Message 


From: Anne Hunter 
To User 


Test User(test@localhost.cor I+ 
Subject 
Test Mesg 
Message 


Test Mail Message 
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& Test Mesg - Mozilla Thunderbird 
File Edit View Go Message Tools Help 
Æ Get Mail + Af Write MB Chat QB Address Book | ® Tag 7 
$ Reply @ Reply All| v | => Forward Archive 
From Anne Hunter <anne.hunter@ mail.com=> 
Subject Test Mesg 1/27/2013 8:22 PM 
To Me Other Actions * 


Test Message Content 
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What just happened? 


We have used the Zend\Mail object to send e-mails within the system using the Sendmail 
mail transport; we have also learned about how to send HTML or multi-part mail messages. 


Before moving on to the next section, try to implement the e-mailing form for sending out 
HTML e-mails. 


Zend\EventManager 


Zend Framework 2 is an event-driven framework; the event manager allows you to attach 
events to almost any functionality. There are three main terms used in Zend Framework's 
event management, which are as follows: 


@ Event manager: The EventManager object is the object that holds a collection of 
listeners and their relative events 
Listener: The listener is the callback that reacts to the triggered event 
Event: The event is the action that is triggered by the event manager 
The event manager provides attach() and trigger () to create and trigger events 


respectively. Mostly we will be depending on MVC events for various operation, and the 
sequence of execution of MVC application events is described in the following diagram: 














Application 





The article at the following link explains the sequence of events in a 
S 
= 


ZF2 application: 
Q http://akrabat.com/zend-framework-2/a-list-of- 
z£2-events/ 


Chat and E-mail 


Flow of events for successful execution is as follows: 


1 
2 
3. 
4 


ot E o 


Zend\Mvc\Application: Bootstrap 
Zend\Mvc\Application: Route 
Zend\Mvc\Application: Dispatch 


Zend\Mvce\Controller\ActionController: Dispatch (if controller extends this 
class) 


Zend\Mvc\Application: Render 
Zend\View\View: Renderer 
Zend\View\View: Response 


Zend\Mvc\Application: Finish 


In case of errors during dispatch (or) route, the flow of events will be as follows: 


1 
2 
3. 
4 
5 


Zend\Mvc\Application: Dispatch.error 
Zend\Mvc\Application: Render 
Zend\View\View: Renderer 
Zend\View\View: Response 


Zend\Mvc\Application: Finish 


In our next activity, we will try to set a new layout for multiple controllers using the shared 
event manager in Zend Framework. 


Time for action — setting module layout using ZF events 





Perform the following steps for setting the module layout using ZF events: 


1. 


2. 


Create a new layout for the My Account page and save it under CommunicationApp/ 
module/Users/view/layout/myaccount-layout.phtml. 


Add the layout to the CommunicationApp/module/Users/config/module. 
config.php file under view manager -> template map: 
‘layout/myaccount! => . DIR... . '/«./view/layout/myaccount-layout . 
phtml', 


Open the CommunicationApp/module/Users/module. php file and add 
references to MvcEvent: 


use Zend\Mvc\MvcEvent ; 
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4. Overwrite the onBoot Strap () method with the following code: 


public function onBootstrap (Se) 
SeventManager = Se->sgetApplication() ->getEventManager () ; 
SmoduleRouteListener = new ModuleRouteListener() ; 
SmoduleRouteListener->attach(SeventManager) ; 


SsharedEventManager = SeventManager->getSharedManager(); // The 
shared event manager 
SsharedEventManager->attach( NAMESPACE _, MvcEvent: :EVENT_ 
DISPATCH, function(Se) { 
Scontroller = S$e->getTarget(); // The controller which is 
dispatched 
ScontrollerName = Scontroller->getEvent () 
->getRouteMatch()->getParam('controller'); 
if (!in_ array ($controllerName, 
array ('Users\Controller\Index', 'Users\Controller\ 
Register', 'Users\Controller\Login'))) { 


Scontroller->layout ('layout/myaccount') ; 


}); 
} 


5. Open the Communication Application page in any web browser; make a note 
of the layout: 


Z> Communication Applicat x 


€ & comm-app.local/users/! 


pa - - s> - 
Ofalaalaalllal artila ADDCO Tal 
WUT munication Appiica A 


Login 


Email 
anne.hunter@mail.com 


Password 
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6. Login to the application and see the new layout being applied: 


Z= Communication Applicat x 


& E comm-app.local 


Communication Application Sroup chat Manage Users Manage Doc:\pents 


My Uploads 


Label Filename Actions 


Sales Report Document.doc Edit | Delete 


Shared Uploads 


Label Filename Shared By 


» Add Upload 


© 2005 - 2012 bv Zend Technologies Ltd. All riahts reserved. 





What just happened? 


We have used the Zend Framework event manager to attach a listener to the Dispatch event 
of the module. So every time the controller is dispatched, this event is triggered. The callback 
checks if the controller is valid and if the controller is not among the list of controllers that have 
the default layout, then the myaccount layout is applied to these controllers. 





Q1. Which of the following helpers can be used to define/attach CSS styles inside the HTML 
head section? 


1. HeadLink 
2. HeadScript 
3. HeadCss 

4. HeadStyle 


Q2. Which of the following are valid mail transports supported by Zend Framework 2? 


Zend\Mail\Transport \Pop 
Zend\Mail\Transport\Smtp 


Zend\Mail\Transport\Imap 


=e PD 


Zend\Mail\Transport\File 
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Summary 


We have covered a wide range of topics in this chapter; first we learned about making 

use of external JavaScripts. Next we created a simple group chat application and then we 
learned about Zend\Mail and implemented a simple mailing form. Towards the end, we 
learned about events and how to make use of these events in Zend Framework. In the next 
chapter we will be working on media sharing using Zend Framework by working with various 
media-sharing APIs. 
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Uploading and managing images/videos on the Internet has become very 
common with the advent of social media. More and more applications now 
allow you to share and retrieve media with external media hosts/services such 
as Google, Flickr, and YouTube. In Zend Framework 1.0, the Zend_Service 
package offered a large number of third-party integrations. This has changed 
with ZF2 and the new module framework. 





In this chapter, we will use various external Zend Framework 2.0 modules to manage images 
and videos. Let's quickly look at the topics that we will be learning in this chapter: 

Installing external modules in the Zend Framework application 

Setting up a simple photo gallery 

Resizing and manipulating images using WebinoImageThumb 

Introduction to the Zend GData API 

Using the GData API to fetch albums from Google Photos and YouTube 
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One of the most important features of Zend Framework 2.0 is the ability to integrate 
external modules in your PHP application, and this integration is completely managed 
using a dependency management tool (in our case, Composer). 


This feature allows development of PHP applications without having to worry about 
maintaining external libraries inside your application. Libraries and applications can be 
decoupled and maintained separately. 


Media Sharing 


In this chapter, we will be using an external module for resizing images; we will also make 
use of external libraries for connecting to Google services. 


Composer 


Framework. Composer allows developers to declare the dependencies needed 
for their application and will handle the installation of those libraries. The 
dependency configuration is stored in a file named composer. json. 


Q Composer is the one of the dependency management solutions used in Zend 


Zend Framework 1.0 had a resize filter that allowed images to be resized on upload; with 
Zend Framework 2.0, this option no longer exists. Our next task will be to find a simple 
image-resizing module and install it in our application. So let's get started. 


Time for action — resizing images using modules 


Carry out the following steps: 





1. Goto the Zend Framework 2 module's site: 


http://modules.zendframework.com/ 


2. Run a search for WebinoImageThumb. 


3. To install this module, you will need to update composer. json in the application 
root and include this module as a required module. 


4. Todo this, edit CommunicationApp/composer.json and modify the 
required section: 


"require": { 
Moho" “S25 2.3.3"; 
"Zendframework/zendframework": "2.0.¥*", 
"webino/webino-image-thumb": "1.*", 

} 


5. Now run composer.phar update to install the newly added dependency. 
$ php composer.phar update 
Loading composer repositories with package information 
Updating dependencies 


- Installing webino/webino-image-thumb (1.0.0) 
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Writing lock file 


Generating autoload files 


6. 


You will be able to see the newly installed modules in the vendor folder as follows: 


a ammunicationÄpp 
4 G2 CommApp 
P Ei config 
, = data 
> 5 module 
- Æ public 
4 GB vendor 
Z bin 
|G composer 
4 ( webino 
4 E webino-image-thumb 
* g3 src 
> [E] autoload_classmap.php 


» |F] autoload_function.php 
> [F] autoload_register.php 
=| composer.json 
LICENSE.txt 


Module.php 
E| README.rnd 
> Ge zendframework 
» |F] autoload.php 
[=| README.md 
composerjson 
=| composer.lock 


=| composer.phar 





7. 


Now that the module is downloaded, we will need to activate the module 


in CommunicationApp/config/application. config. php by adding 
'WebinoImageThumb' to the modules array. 


return array ( 
'modules' => array ( 
'Application', 
'WebinoImageThumb', 
‘Users, 


), 
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What just happened? 


We have installed an external module into our application using the dependency 
management tool, Composer. We have also activated the module in our application 
so that the module is accessible across the application. 





Now that you know how to install new modules in the Zend Framework 2 application, here 
is a simple task for you. Install the Zend GData package on this application. Instructions for 
installing this package are available at https: //packages. zendframework.com/. We 
will be using this module in the subsequent sections of this chapter. 


The Photo gallery application 


Let us get started with implementing our custom photo gallery using Zend Framework 2. 
Since we have already implemented a file management interface, we will use a similar 
interface to implement a photo gallery. 


The schema for a photo gallery will be similar to the Upload entity; additionally, we will have 
a field to store the thumbnail filename, which is generated during upload. Both the images 
and the generated thumbnails will be stored in the <Module>\data\images folder. We will 
use a custom action to display the images in the browser. 


Before we get started, let's quickly review some of the important methods that are 
supported by WebinoImageThumb: 


+ 


resize (SmaxWidth = 0, SmaxHeight = 0): This function resizes the image 
to the specified height and width; if either of the values is set to 0, that dimension 
will not be considered as a limiter 


adaptiveResize (Swidth, Sheight): This function attempts to get the image 
as close to the provided dimensions as possible, and then crops the remaining 
overflow (from the center) to get the image to be the size specified 


crop (SstartX, S$startY, S$cropWidth, ScropHeight): This function crops 
the images from the given coordinates to the specified width and height 


rotateImage (Sdirection = 'CW'): Rotates the image by 90 degrees 
clockwise or counterclockwise 


rotateImageNDegrees (Sdegrees): Rotates the image by the specified degrees 


save (S$fileName, Sformat = null): Saves the image by the specified filename 
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Time for action —implementing a simple photo gallery 


Carry out the following steps: 





1. Create a new entity called ImageUpload with the following table structure: 


CREATE TABLE IF NOT EXISTS image uploads ( 
id INT NOT NULL AUTO INCREMENT PRIMARY KEY , 
filename VARCHAR( 255 ) NOT NULL , 
thumbnail VARCHAR( 255 ) NOT NULL , 
label VARCHAR( 255 ) NOT NULL , 
user id INT NOT NULL, 
UNIQUE KEY (filename) 
E 


2. Create the relevant ImageUpload entity in the src/Users/Model / 
ImageUpload. php file, the TableGateway object in the src/Users/Model / 
ImageUploadTable. php file, and the Controller (MediaManagerController) 
inside the module (CommunicationApp/module/Users) in the src/Users/ 
Controller/MediaManagerController.php file. 


3. Inthe Upload form's Submit process, generate the thumbnail by using a new 
method called generateThumbnail (); this method will take the filename of the 
existing image as the parameter. The resize method resizes the image to 75x75 px 
and saves it to the image upload directory with a tn_ prefix. 


This method needs to be placed in the MediaManagerController file, src/ 
Users/Controller/MediaManagerController.php. 


public function generateThumbnail (S$imageFileName) 


{ 


Spath = Sthis-sgetFileUploadLocation() ; 


SsourceImageFileName = $path . '/' . SimageFileName; 
SthumbnailFileName = 'tn_' . SimageFileName; 
SimageThumb = Sthis->sgetServiceLocator () 


->get ('WebinoImageThumb') ; 


Sthumb = SimageThumb->create ( 
SsourceImageFileName, 


Soptions = array()); 
Sthumb->resize(75, 75); 
$thumb->save ($path . '/' . $thumbnailFileName) ; 


return SthumbnailFileName; 
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4. Our next step is to write an action to render the image in the Full and Thumbnail 
modes; for this we will need to create a custom route that will take the action, 
id, and subaction parameters. This is achieved by the following route definition 
in the module configuration file, CommunicationApp/module/Users/config/ 
module.config.php: 


'media' => array ( 
'type'! => 'Segment', 
'options' => array ( 
'route'! => '/media[/:action[/:id[/:subaction]]]', 
'constraints' => array ( 
'action' => '[a-zA-Z] [a-zA-Z0-9 -]*', 
"id! => '[a-zA-Z0-9 -]*', 
'subaction' => '[a-ZA-Z] [a-zA-Z0-9 -]*', 
ha 
'defaults!' => array ( 
'controller' => 'Users\Controller\MediaManager', 
faction => 'index', 


hg 
), 


5. Our next step is to write an action that will respond to the various image 
requests. This action needs to be placed in the MediaManagerController 
file, src/Users/Controller/MediaManagerController.php. 


public function showImageAction () 
{ 
SuploadiId = Sthis->params()->fromRoute('1id') ; 
SuploadTable = Sthis->getServiceLocator () 
->get ('ImageUploadTable'); 
Supload = SuploadTable->getUpload(SuploadId) ; 


// Fetch Configuration from Module Config 


SuploadPath = Sthis->getFileUploadLocation() ; 
if ($this->params()->fromRoute('subaction') == 'thumb') 
{ 


$filename = $uploadPath ."/" . Supload->thumbnail; 
} else { 
$filename = $uploadPath ."/" . Supload->filename; 


} 


stile = file get contents ($filename); 


// Directly return the Response 
Sresponse = Sthis->getEvent () ->getResponse () ; 
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Sresponse->getHeaders () ->addHeaders (array ( 
'Content-Type' => 'application/octet-stream', 
'Content-Disposition' => 'attachment;filename="' 


.Supload->filename . !'"', 


DF 
Sresponse->setContent ($file) ; 
return Sresponse; 


} 


6. Make sure the process works completely, from uploading the picture to 
the gallery to displaying it in the photo page. See the following code for the 
usage of showImageAction() in the upload view in the media manager, 
CommunicationApp/module/Users/view/users/media-manager/view. 
phem: 


<section class="upload"> 
<h2><?php echo Sthis->escapeHtml ($upload->label);?></h2> 
<h4><?php echo Sthis->escapeHtml (Supload->filename) ;?></h4> 
<img src="<?php echo $this->url('users/media', 
array ('action'=>'showImage', 

'id' => Supload->id, 

'subaction' => 'full'));?>" /> 
</section> 
<a href="<?php echo Sthis->surl('users/media');?>"> 

&raquo; Show Gallery</a> 


7. Now test the application on a browser of your choice. The image upload page should 
look like the following screenshot: 


Communication Application 


Upload 





Image Description) City 








Image Upload | Choose File | City JPG 








Upload Now | 
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Once the image upload form is successfully submitted, the image will be resized and shown 
in the gallery as shown in the following screenshot: 


Actions 


Delete 


» Upload Image 
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The View Image link on top of the resized image takes you to a page with the full-sized image: 


City 


City.JPG 
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What just happened? 


We have implemented a simple photo gallery by making use of an external image manipulation 
library. We utilized the resize function to create thumbnails and we created a custom action 
to handle image rendering in the web browser. 





Now that you understand how to work with the WebinoImageThumb module, your next 
task will be to extend the photo gallery to support the rotate function. Add a rotate 
function to the View Image page and allow the user to rotate the image both clockwise 
and anticlockwise. 


Google Data APIs provide a simple interface for applications to read and write data into 
various Google services. The Data APIs use a protocol similar to the Atom Publishing Protocol 
for data transfer. All the services are implemented in the package called ZendGdata. 


Some of the most frequently used Google services that are supported by the ZendGdata API 
are listed as follows: 

Picasa Web Albums 
YouTube 

Google Calendar 
Google Spreadsheets 
Google Documents 
Google Provisioning 
Google Analytics 
Google Blogger 
Google CodeSearch 
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Google Notebook 


Since ZendGdata is not provided with the default Zend Framework installation, this 
needs to be installed manually. This can be performed using Composer and by fetching 
"zendframework/zendgdata": "2.*", 
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The Google Photos API 


The Google Photos API allows you to fetch, edit, and manage your photos and albums in 
your Picasa or Google+ accounts. The Data API provides all kinds of services; some of the 
key functions are listed as follows: 
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getUserFeed (): Gets all the associated albums for that user 
insertAlbumEntry (): Creates a new album 
getAlbumFeed (): Fetches the specified album 
insertPhotoEntry (): Creates a new photo 

get PhotoFeed (): Fetches the specified photo 
insertCommentEntry (): Creates a new comment 
getCommentEntry (): Fetches the specified comment 
insertTagEntry (): Creates a new tag 
getTagEntry (): Fetches the specified tag 
deleteAlbumEntry (): Deletes the album 
deletePhotoEntry (): Deletes the photo 
deleteCommentEntry (): Deletes the comment 


deleteTagEntry (): Deletes the tag 


In this example we will fetch the user's existing albums and the photos stored inside 
those albums. 


Before moving on, ensure that the ZendGdata library is installed in your 
application using Composer. Refer to the following installation instructions: 


vl @ Add the following line to the requires section of 


CommunicationApp/composer.json: 


"zendframework/zendgdata": "2.*" 


@ Update the application dependencies using Composer: 
$ php composer.phar update 


Before getting started, make sure you have uploaded some photos on your Google 
Photos account. 
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Time for action — fetching photos from Google Photos 


Follow these steps to fetch photos from your Google Photos account: 





1. Create a method, getGooglePhotos (), in your controller that will connect to 
Google Photos and fetch all albums from Google Photos. This method needs to 
be placed in the MediaManagerController file, src/Users/Controller/ 
MediaManagerController.php. 


2. Setup the API client to make use of the Curl request with the option to disable 
sslverifypeer. 


Sadapter = new \Zend\Http\Client\Adapter\Curl (); 
Sadapter->setOptions (array ( 
'curloptions' => array ( 
CURLOPT SSL VERIFYPEER => false, 
) 
aes 


ShttpClient = new \ZendGData\HttpClient () ; 
ShttpClient->setAdapter (Sadapter) ; 


Sclient = \ZendGData\ClientLogin: :getHttpClient ( 
self::GOOGLE USER ID, 
self: :GOOGLE PASSWORD, 
\ZendGData\Photos: :AUTH_ SERVICE NAME, 
ShttpClient) ; 


3. Now create a new Google Photos client using the API client. 
Sgp = new \ZendGData\Photos (Sclient) ; 


4. Now fetch the list of albums using getUserFeed () and get the list of images inside 
the album using getAlbumFeed (). 


SuserFeed = Sgp->getUserFeed( self::GOOGLE USER ID ); 
foreach (SuserFeed as S$userEntry) { 


SalbumId = SuserEntry->getGphotolId()->getText () ; 


SgAlbums [SalbumId] ['label'] = SuserEntry->getTitle() - 
>getText () ; 


Squery = Sgp->newAlbumQuery () ; 


Squery->setUser( self::GOOGLE USER ID ); 
Squery->setAlbumId( SalbumId ); 
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SalbumFeed = Sgp->getAlbumFeed (Squery) ; 


foreach (SalbumFeed as SphotoEntry) { 
SphotolId = SphotoEntry->getGphotolId()->getText () ; 


if (SphotoEntry->getMediaGroup()->getContent() != null) { 
SmediaContentArray = SphotoEntry->getMediaGroup () - 
>getContent () ; 


SphotoUrl = SmediaContentArray[0]->getUrl () ; 


if (SphotoEntry->getMediaGroup ()->getThumbnail() != null) 
SmediaThumbnailArray = SphotoEntry->getMediaGroup () - 


>getThumbnail () ; 
SthumbUrl = SmediaThumbnailArray[0]->getUrl () ; 


SalbumPhoto = array(); 


SalbumPhoto['1id'] = Sphotold; 
SalbumPhoto['photoUrl'] = SphotoUrl1; 
SalbumPhoto['thumbUrl'] = SthumbUrl; 
SgAlbums [SalbumId] ['photos'][] =SalbumPhoto; 


} 


// Return the consolidated array back to the view for rendering 
return SgAlbums; 


5. The following code block in the album view is used to render the albums; this can 
be placed in the media manager's index view, CommunicationApp/module/ 
Users/view/users/media-manager/index.phtm1: 


<?php foreach (SgoogleAlbums as SgoogleAlbum) : ?> 

<h4> <?php echo Sthis->escapeHtml (S$googleAlbum['label']) ;?> 

</h4> 

<?php foreach (SgoogleAlbum['photos'] as SgoogleAlbumPhoto) : ?> 
<div class = "googleAlbumPhoto" 


style="padding:10px; display:inline"> 
<a href="<?php echo Sthis->escapeHtml (SgoogleAlbumPhoto['p 


hotoUrl1']);?>"> 
<img src="<?php echo Sthis->escapeHtml (SgoogleAlbumPhoto['! 
thumbUrl']);?>" /> 
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</a> 
</div> 
<?php endforeach; ?> 
<?php endforeach; ?> 
<hr /> 


6. Upload pictures to your Google Photos album: 


+Zend Search Images Maps Play YouTube News Gmail Drive Calendar More- 
Google+ (ects Saal Zend Framework EJ + Share cy v 


Instant Upload Albums From posts Photos of you 


Test Album ; Add photos Slideshow 
2 Visible to: Limited (gå Unlocked) ary 19, 2042 


Photos 


: Terms of Use - Content Policy - Privacy - English (United States} / Set region - Create a page 
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7. Open the page in a browser window; you should be able to see all available albums 
and photos inside the album: 


Communication Application 


Actions 


Delete 


Niagara Falls 


» Upload Image 


Google Photos - Albums 


Test Album 
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What just happened? 


We have successfully used Google Data APIs to fetch Picasa upload information from Google 
and used that information to render galleries in our application. 


Your next task will be to implement the photo upload option using Google Data APIs when 
viewing a photo in the photo gallery; you will have a button that will allow you to upload the 
photo to Google Photos. 
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YouTube Data API 


The YouTube Data API allows access to YouTube content; you can use this API to fetch videos, 
playlists, channels, post comments, and upload and manage videos. Users are allowed 

to perform unauthenticated requests for the retrieval of feeds on popular videos, post 
comments, and so on. 


Some of the most frequently used YouTube API methods are listed as follows: 


getVideoFeed (): Retrieve videos from a video query 

get TopRatedVideoFeed (): Retrieve top-rated videos for the specific video query 
getUserUploads (): Retrieve the user's uploaded videos 

getUserFavorites (): Retrieve the user's favorite videos 

get VideoResponseFeed (): Get video responses for a specific video 
getVideoComment Feed (): Get comments for a specific video 
getPlaylistListFeed(): Geta user's playlists 


getSubscriptionFeed (): Get a user's subscriptions 


+% ©% ©% ©% >% YH FH OH 


insertEntry (): Upload a video to YouTube 


In this example, we will be retrieving videos for a specific keyword and then render them in 
the web page. 


Time for action — listing YouTube videos for a keyword 


Perform the following steps for listing YouTube videos for a keyword: 





1. Create a function that will get the YouTube videos for the Zend Framework keyword. 


2. Establish the connection in a similar way to the previous connection made for 
Google Photos. This needs to be placed in a new method, getYoutubeVideos (), 
in the MediaManagerController file, src/Users/Controller/ 
MediaManagerController.php: 

Sadapter = new \Zend\Http\Client\Adapter\Curl () ; 
Sadapter->setOptions (array ( 
'curloptions' => array ( 
CURLOPT SSL VERIFYPEER => false, 
) 
yd 


ShttpClient = new \ZendGData\HttpClient () ; 


[119] 


Media Sharing 


ShttpClient->setAdapter (Sadapter) ; 


Sclient = \ZendGData\ClientLogin: :getHttpClient ( 
self::GOOGLE USER_ID, 
self: :GOOGLE PASSWORD, 
\ZendGData\YouTube: : AUTH SERVICE NAME, 
ShttpClient) ; 


3. Initialize the YouTube client and execute a video query for the keyword 
zend Framework: 


Syt = new \ZendGData\YouTube ($client) ; 
Syt->setMajorProtocolVersion (2) ; 

Squery = Syt->newVideoQuery () ; 
Squery->setOrderBy ('relevance') ; 
Squery->setSafeSearch('none') ; 
Squery->setVideoQuery('Zend Framework' ) ; 


4. Parse the query results and store it in an array: 


SvideoFeed = Syt->getVideoFeed (Squery->getQueryUrl (2) ) ; 


SyVideos = array(); 

foreach (SvideoFeed as SvideoEntry) { 
SyVideo = array(); 
SyVideo['videoTitle'] = SvideoEntry->getVideoTitle() ; 
SyVideo['videoDescription'] = 
SvideoEntry->getVideoDescription() ; 
SyVideo['watchPage'] = SvideoEntry->getVideoWatchPageUrl () ; 
SyVideo['duration'] = S$videoEntry->getVideoDuration () ; 
SvideoThumbnails = SvideoEntry->getVideoThumbnails() ; 


SyVideo['thumbnailUrl'] = SvideoThumbnails[0] ['url']; 
SyVideos[] = SyVideo; 


} 


return SyVideos; 
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5. The resulting content is rendered in the view and a video listing as shown in the 
following screenshot: 


Communication Application 


Zend Framework | 1 - Instalação e Configuração 


SERIE ZEND FRAMEWORK 1 -= Ola, quem vos fala é Welsiton Ferreira e nesse tutorial eu irei 
mostrar como fazer o download, instalação e configuração do Zend F.. 


Duration : 1002 secs 


Zend Framework Tutorial: Quickstart (2) 


Im using version 1.11. After installing Zend Framework, follow this tutorial to see how we do some 
basic things like makes controllers and layouts. http://jr. 


Duration : 473 secs 


Zend Framework 2 Overview 


Duration : 3247 secs 


Why choose the Zend Framework over other PHP Frameworks? 


http://www_killersites.com - In this video | go over the reasons why | choose the Zend framework 
over the other PHP frameworks that are out there. We've only.. 


Duration : 489 secs 





What just happened? 


We have utilized the ZendGData API's YouTube APIs to retrieve a simple list of videos from 
YouTube for a specific keyword. 





Q1. Which command is used in Composer to install a newly configured dependency? 


1. php composer.phar setup 

2. php composer.phar self-update 
3. php composer.phar show 

4. php composer.phar update 
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Q2. Which of the following is a valid method to upload a new photo to Google Photos? 


1. uploadPhoto() 
2. angsert Photo () 
3. uploadNewPhoto () 
4 


insertPhotoEntry () 


Summary 


In this chapter, we have learned various techniques to manage media; initially we started 
with implementing our own photo gallery and later on we moved on to using Google GData 
APIs to retrieve and store media on the Web. 


In our next chapter, we will be working on implementing a simple search interface. 
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Search Using Lucene 





More often than not, we will come across web applications that need support 
for built-in search capabilities. Sometimes the search could involve searching a 
simple field in a MySQL table, or at times you may want to search a document 
or a plain text file; there are multiple ways to address the search requirements 
using various search libraries. Lucene is one such library that offers excellent 
search capabilities for implementing full text search. 





In this chapter we will be using Zend Framework's Lucene search implementation. Zend 
Framework 1.0 had a built-in Zend Search Lucene library which supported indexing 
and searching with Lucene; in ZF 2.0, this library is available as ZendSearch\Lucene, 
which can be downloaded and installed on your web application. In this chapter, we will 
be learning the fundamentals of implementing a full-text search using the Lucene search 
library in the following topics: 


Installing the ZendSearch library in your application 
Creating data index for simple MySQL data 


Querying the Lucene index 
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Adding new documents files to the index 


introduction to Lucene 


Lucene is a high-performance, scalable information retrieval (search) library developed 
by Apache Foundation, which can be used for implementing free-text search in web 
applications. Lucene provides a simple-to-use API, which will provide powerful indexing 
and searching capability to your web application. To read more about Lucene visit 
http://lucene.apache.org/. 


Search Using Lucene 
The most important components of the Lucene search library are explained as follows: 
@ Index: Lucene index is the data store that holds all the indexed documents; queries 


are executed against the index to fetch the documents. 


@ Document: A document is the default building block for a Lucene index; documents 
can be compared to records in a table. Each document holds a number of fields 
upon which queries can be executed. 


@ Field: Each Lucene document comprises of one or more fields; it is not necessary 
that all the fields are indexed, fields can also be stored without indexing. 


The Lucene search works based on the index, so it is necessary to have the index updated 
with the latest content to get the best search results. The following diagram explains the 
overview of the Lucene search: 


Documents 


Other Text Data 





Time for action — installing ZendSearch\Lucene 


Perform the following steps for installing ZendSearch\Lucene: 


1. ZendSearch\Lucene was not available as a composer package at the time of 
writing this book. So, we will check out the source from the GitHub repository. The 
repository is available at https: //github. com/zendframework/ZendSearch. 


2. Next we need to navigate to the vendor folder: 


$ cd /var/www/CommunicationApp/vendor/ 


3. Clone the Zend search repository into the vendor folder: 


$ git clone https://github.com/zendframework/ZendSearch.git 
zendSearch 
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4. Next we should configure the ZendSearch library using composer: 
$ cd ZendSearch/ 
$ curl -s https://getcomposer.org/installer | php 
$ php composer.phar install 


5. Once the library is configured, we will need to define a module-level configuration 
to store the index location. To do this, we need to modify CommunicationApp/ 
module/Users/config/module.config.php, and add a new configuration for 
search index: 


// MODULE CONFIGURATIONS 


module config" => array | 
‘upload: location’ => DIR. = “/«./datasuploads", 
'image upload location! => DIR_ . '/../data/images', 
'search index' => ð DIR_ . '/../data/search index' 


) 


What just happened? 


We have now downloaded and configured the ZendSearch library for Zend Framework 
2.0; the previous tutorial also provides us with a guideline for downloading and installing 
packages which cannot be downloaded directly from Composer. 


Now that we have the ZendSearch\Lucene search library installed, our next task 
will be to create a Lucene index for some of the data that is already stored in our 
communication application. 


Indexing is a fairly straightforward process using ZendSearch\Lucene. All we need is to 
create documents with fields and values, and keep adding the document to the index. You 
can also remove documents, update documents, and clear an index. The following classes 
are used in index generation: 


@ Field-—The ZendSearch\Lucene\Document \Field class allows users to define 
a new document field; this field can be classified into one the following types: 


Q Field::keyword(Sname, $value, Sencoding = 'UTF-8'):the 
keyword field type is used to identify string fields that don't have to be 
tokenized, yet need to be indexed and stored. For example, date and URL. 


a Field::unIndexed(Sname, $value, Sencoding = 'UTF-8'):The 
unIndexed field type is used to store fields in the index without having to 
index/tokenize them. For example, ID fields. 
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a Field::binary(Sname, $value): The binary field type is used for 
storing binary values in the index. 


a Field::text(Sname, $value, Sencoding = 'UTF-8'):Thetext 
field type is the most common field type used for describing short strings 
which are tokenized and stored in the index. 


a Field::unStored(Sname, $value, Sencoding = 'UTF-8'):The 
unStored field type is used to identify fields that will be tokenized and 
indexed, but not stored in the index. 


@ Document — The ZendSearch\Lucene\Document class allows definition of a 
new index document. Some of the most commonly-used methods in this class 
are described as follows: 


o addField(Document\Field $field): Adds anew field to 
the document 


a getFieldNames (): Used to retrieve all field names from the document 


a getField(SfieldName): Used to retrieve a specific field from 
the document 


a getFieldValue ($fieldName) : Used to retrieve a specific field value 
from the document 


@ Index- Index can be retrieved using the create () and open() methods 
in the ZendSearch\Lucene class. Both the methods take the index path 
as the parameter and return an index of type ZendSearch\Lucene\ 
SearchIndexInterface. The SearchIndexInterface provides 
the following methods for manipulating the documents inside the index: 


Q addDocument (Document document): Adds anew document to 
the index 


a delete ($id): Deletes the indexed document based on the internal 
document ID 


a optimize (): Helps in optimizing the index, by merging all segments into a 
single segment, thereby increasing the performance 


a commit (): Used to commit transactions to the search index 


Now that we have learned about the methods that are used for index generation, 
let's get started and generate the index for the uploads table that is available in 
our communication application. 
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Time for action — generating a Lucene index 


Perform the following steps for generating a Lucene index: 





1. Create a new search controller, CommunicationApp/module/Users/src/ 
Users/Controller/SearchController.php, which will be used for searching 
and generating indexes. 


2. Add references to ZendSearch\Lucene: 


use ZendSearch\Lucene; 
use ZendSearch\Lucene\Document ; 
use ZendSearch\Lucene\ Index; 


3. Add a method to fetch the index location from the module configuration: 


public function getIndexLocation () 
{ 
// Fetch Configuration from Module Config 
Sconfig = Sthis->getServiceLocator()->get('config') ; 
if (Sconfig instanceof Traversable) { 
Sconfig = ArrayUtils::iteratorToArray (S$conf1i1g) ; 


} 


if (l!empty(Sconfig['module config'] ['search index'])) { 
return Sconfig['module config'] ['search index'] ; 
} else { 


return FALSE; 


} 


4. The index document needs to be generated in the following format: 


Index field Description 

upload_id This is non-indexed field which will be used for retrieving the 
uploaded file that gets returned in the search results 

label This field is used to index the Label field of the uploads table 

owner This field is used to index the name field of the user who 


uploaded the document 


5. Create a new action to generate the index: 


public function generateIndexAction () 


{ 


SsearchIndexLocation = Sthis->getIndexLocation() ; 
Sindex = Lucene\Lucene: :create (SsearchIndexLocation) ; 


SuserTable = Sthis->getServiceLocator()->get('UserTable') ; 
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SuploadTable = Sthis->getServiceLocator()->sget('UploadTable') ; 
SallUploads = SuploadTable->fetchAll () ; 
foreach($allUploads as $fileUpload) { 


as 
SuploadOwner = SuserTable->getUser (S$fileUpload-suser id); 


// create lucene fields 
SfileUploadiId = Document\Field: :unIndexed ( 
'upload_id', $fileUpload->id) ; 
Slabel = Document \Field: : Text ( 
'label', SfileUpload->label) ; 
Sowner = Document\Field: :Text ( 
'owner', SuploadOwner->name) ; 


// create a new document and add all fields 
SindexDoc = new Lucene\Document () ; 
SindexDoc->addField(Slabel) ; 
SindexDoc->addField(Sowner) ; 
SindexDoc->saddField(SfileUploadId) ; 
Sindex->addDocument (S$indexDoc) ; 


} 


Sindex->commit () ; 


} 


Now open the action URL (http: //comm-app.local/users/search/ 
generateIndex) in your web browser, and if everything works as expected, 
you will see that the index files that created in the search index folder. 


The following screenshot shows the browser response upon a successful index update: 
Communication Application - Mozilla Firefox 


-| Communication Application 


= comm-app.local 


Index updated sucessfully 


© 2005 - 2012 by Zend Technologies Ltd. All rights reserved. 
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You can see in the following screenshot that the index files are generated and stored in the 
search index folder: 


Z config 
a (4 data 
(4 images 

4 C search index 
j Tcs 
=) Tsi 
=| optimization.lock.file 

read-lock-processing.lock.file 

=) read.lock.file 


=| segments_k 


segments.gen 





write, lock.file 


What just happened? 


Now we have created a method to index the data stored in the MySQL table to the Lucene 
data store; our next step will be to have some queries executed against the Lucene index 
and to fetch and show the results. 


Searching the index is relatively simple using ZendSearch\Lucene. The index needs to 

be opened for querying and the query string needs to be passed to the find () method in 
ZendSearch\Lucene\Index. The find methods return an array matching the hits for the 
specific query, and this in turn can be used to render the search results. 


There are two options for querying the index—you can pass the plain text query string to 
the find function or you can build your own Query object using ZendSearch\Lucene\ 
Search\Query. 


i To read more about various query options in ZendSearch\Lucene, check the 
Q following developer documentation: 


https://zf2.readthedocs.org/en/release-2.2.0/ 
modules/zendsearch. lucene. queries.html 


[129] 


Search Using Lucene 


In the following example, we will be using plain text queries, and you can manipulate the 
search results by using operators such as :,+,-, and field searches. For example, see the 
following list: 


+ 


A search for all documents uploaded by Anne could be retrieved by the 
following query: 


owner : Anne 


A search for all documents having the word report and uploaded by the user 
named Anne could be retrieved by the following query: 


report AND owner :Anne 


A search for all documents having the word report and excluding the ones 
uploaded by Anne could be retrieved by the following query: 


report -owner :Anne 


Time for action — displaying search results 





Perform the following steps for displaying search results: 


ZT, 


For displaying the search results, we will need to create a new form which will 
display the search textbox and render the search results right below the search 
form. The form will be placed in SearchController under CommunicationApp/ 
module/Users/src/Users/Controller/SearchController.php. 


Create a new view which will be used for displaying the query window and also 
rendering search results. This will be placed under CommunicationApp/module/ 
Users/view/users/search/index.phtml. 


<h3>Document Search</h3> 
<?php 
// Search Form 
echo Sthis->form() ->openTag(Sform) ; 
foreach (Sform as Selement) { 
echo Sthis->formElement (Selement) ; 
echo Sthis->formElementErrors (Selement) ; 


} 


echo Sthis->form() ->closeTag() ; 


// Search Results 


if (count ($searchResults)) { 
?> 
<h5>Results</h5> 


<table style="width: 600px; border:1px solid #f£5f£5f5;"> 


<tr> 
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<th width=305" align="left">- Label</th> 
<th width="30%" align="left"> Owner</th> 
<thalign="left"> File</th> 

</tr> 

<?php foreach (SsearchResults as SsearchResult) { 

?> 

<tr> 
<td><?php echo $searchResult->label; ?></tdə> 
<td><?php echo $searchResult->owner; ?></td> 
<td><a href="<?php echo Sthis->escapeHtml ($this->surl ('users/ 
upload-manager', 


array ('action'=>!'fileDownload', ‘'id' => 
SsearchResult->upload_id))) ;?>">Download</a></td> 
</tr> 
<?php 
} 
?> 
</table> 
<?php }?> 


Now create a new action which will display the Search form and also query the 
Lucene index with the input provided in the Search form. This will be placed in 
SearchController under CommunicationApp/module/Users/src/Users/ 
Controller/ SéarchControl ler -php: 


public function indexAction () 


{ 


Srequest = S$this->getRequest (); 


if (Srequest->isPost()) { 
SqueryText = S$request->getPost()->get('query') ; 
SsearchIindexLocation = $this->getIndexLocation() ; 


Sindex = Lucene\Lucene: :open($searchIndexLocation) ; 
SsearchResults = $index->find($queryText) ; 


} 


// prepare search form 
Sform = new \Zend\Form\Form() ; 
Sform->add (array ( 


'name' => 'query', 
‘attributes! => array ( 
'type' => 'text', 
'id' => 'queryText', 
'required' => 'required' 
Va 
'options' => array ( 
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'label' => 'Search String', 
Ly 
)); 


Sform->add (array ( 


'name' => 'submit', 
‘attributes! => array ( 
'type' => 'submit', 
'value' => 'Search' 
F 
27 
SviewModel = new ViewModel (array ( 
'form' => $form, 
'searchResults' => $searchResults 


) 
l} 
return SviewModeli ; 


} 


4, Test the page in your browser; you should be able to see search results for keywords 
that are available in the Label and owner fields: 


Document Search 


report 


Results 


Label Owner File 
Corporate Report Gavin Miller Download 
Sales Report Anne Hunter Download 


© 2005 - 2012 by Zend Technologies Ltd. All rights reserved 
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On searching using Owner Name, you will get the following search results: 


Document Search 


Miller | Search | 


Results 


Label Owner File 
Corporate Report Gavin Miller Download 


© 2005 - 2012 by Zend Technologies Ltd. All rights reserved. 





What just happened? 


We have now implemented the search results page, which allows us to query for uploaded 
documents using their labels and owners. The retrieved search results are displayed ina 
customized view which allows us to download the document from the search result. 


Our next step will be to expand the search to search the contents of the uploaded 
documents; for this we will need to make changes to the way we generate the index. 


Indexing Microsoit Office documents 


As we have seen in the previous example, it is usually insufficient to index the documents’ meta 
information. Most of the time the query string is only present in the document's content. In 
order to achieve that, we need to parse the document and index the content; ZendSearch\ 
Lucene provides support indexing the contents of the following document types: 


@ For HTML documents the following are the index document creation methods: 


ZendSearch\Lucene\Document\Htm1: : loadHTMLFile ($filename) 
ZendSearch\Lucene\Document \Html1: : loadHTML (ShtmlString) 


@ For Word 2007 documents the following is the index document creation method: 


ZendSearch\Lucene\Document \Docx: : loadDocxFile ($filename) 
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@ For Powerpoint 2007 documents the following is the index document 
creation method: 


ZendSearch\Lucene\Document \Pptx: : loadPptxFile ($filename) 


@ For Excel 2007 documents the following is the index document creation method: 


ZendSearch\Lucene\Document \Xl1sx: :loadXlsxFile ($filename) 


All these methods return a document of type ZendSearch\Lucene\Document, which can 
be improvised further by adding more index fields to it. 


So let's get started by indexing the documents that are available in the uploads section. 


Time for action — indexing document files 


Perform the following steps for indexing document files: 





1. To index office documents, add a new uploads section for sample Word and Excel 
documents. In this case, we will upload a Word document and an Excel spreadsheet 


as follows: 


HS- ws SampleDocument - Microsoft Word = |E = 


Home Insert Page Layout References Mailings Review View io) 


oE E 
L | De PRA 


Calibri (Body) -las ~|] 
|B Z U~- abe x, x| = == 


aa 

AaBbCcDc|| AaBbCcDc AaBbCi — PA 

Past : - i i Change Editi 

m J EZ rE mae) eas ae me TNormal | 1NoSpaci... Headingl + rig me 


Clipboard M Font Fj Paragraph Fj Styles E 


The quick brown fox | 


t 
(e 
F 


jumps over the lazy dog 


Page: 1 of 3 | Words: 9 g 





Sample Word 2007 document 
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7 SampleReport - Microsoft Excel 





Insert Page Layout Formulas Data Review View @-a x 


—— a iti IF i Ea = Y Y i | 
& Calibri = = al a | a z Fy Conditional Formatting g” Insert 2 oN rs) 
Paste p || maia) 





45% Format as Table ~ 3* Delete ~ 
a btt: 5: Sot & Find & 
= Cell Styles ~ Be Formate | <27 Filter” Select 


Clipboard ™ Font ; Alignment E Number E Styles Cells Editing 
K7 í fe 
A 


Av) E BB Ee Ble |S % » |\ 60 38) 











CORPORATE REPORT 2012-2013 


Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce pharetra sollicitudin odio a suscipit. Mauris fermentum cursus odio a 
facilisis. Suspendisse fringilla eros ac nibh ornare ullamcorper. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sed 
iaculis felis. Vestibulum vitae sapien leo. Quisque odio sem, malesuada eu egestas eget, sollicitudin vel eros. Pellentesque mollis, 
quam a gravida egestas, metus mi molestie sapien, sed lacinia libero purus nec mauris. Nam dapibus euismod placerat. Mauris 
pharetra pharetra nulla, eget posuere mi scelerisque non. Etiam luctus euismod nunc, in sodales turpis pellentesque nec. 


Nulla enim lacus, sollicitudin nec ullamcorper ac, posuere at ipsum. Donec sodales tempor nulla, venenatis laoreet metus 
consectetur sit amet. Nulla eu urna nec nulla sollicitudin bibendum ac a nisl. Phasellus quis purus sapien, ut elementum arcu. 
Maecenas libero erat, sollicitudin non venenatis ut, dictum eu ante. Curabitur tincidunt pellentesque euismod. Aenean cursus mi id 
eros venenatis ac facilisis sapien tincidunt. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. 








Sample Excel 2007 spreadsheet 


2. Add the following lines to the indexing function present in SearchController, 
which is present in CommunicationApp/module/Users/src/Users/ 
Controller/SearchController.php, so that the method picks up and indexes 
Word documents and Excel spreadsheets separately: 


if (substr compare ($fileUpload->filename, 


t xlsx", 
strlen(SfileUpload->filename) - strlen(".xlsx"), 
strlen(".xlsx")) === 0) { 


// index excel sheet 
SuploadPath = Sthis-sgetFileUploadLocation() ; 
SindexDoc = Lucene\Document\X1sx: :loadX1lsxFile ( 
SuploadPath ."/" . $fileUpload->filename) ; 
} else if (substr compare ($fileUpload->filename, 


" docx", 
strlen(SfileUpload->filename) - strlen(".docx"), 
scrlen(".docx")), === 0) 4 


// index word doc 
SuploadPath= Sthis->getFileUploadLocation() ; 
SindexDoc = Lucene\Document\Docx: : loadDocxFile ( 
SuploadPath ."/" . $fileUpload->filename) ; 
} else { 


SindexDoc new Lucene\Document () ; 


SindexDoc->saddField(Slabel) ; 
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SindexDoc->addField(Sowner) ; 
SindexDoc->saddField($S$fileUploadId) ; 
Sindex->addDocument (S$indexDoc) ; 


3. Now update the index (navigate to http: //comm-app.local/users/search/ 
generateIndex), come back to the Document Search page, and try searching for 
keywords that are present in the document. You should be able to see the search 


results as shown in the following screenshot: 


oy, a r F 1 r 
i A Porn nll = earn CARP = T alā 
Sil "hail l kt Ha E hae f A - SALL ET ETET. 


Document Search 


Tox | Search | 


Results 


Label Owner File 
sample Document Test User Download 





Search results for the content inside Office documents will be as shown in the 


following screenshot: 


Document Search 


lorem | Search | 


Results 


Label Owner File 
Corporate Report Gavin Miller Download 





What just happened? 


In the last task we saw the implementation of indexing and searching the content 
of Microsoft Office documents. As you can see, it is relatively easy to implement 


these features using ZendSearch\ Lucene. 
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Here is a simple task for you before you move on to the next chapter. Now that we have 
implemented indexing and searching, your task will be to modify the entities so that the index 
is updated each time changes are made to uploads. If a new upload is made, a document 
needs to be added to the index, and if an upload is deleted, it should be removed from the 
index, and so on. 


Q1. Which of the following field types is not tokenized, yet is indexed and stored? 


1. keyword () 

2. unStored () 
3;. text) 
4 


unIndexed () 


Q2. Which of the following file formats is not supported for ZendSearch\Lucene as a valid 
document format for content indexing? 


1. .docx 
2 pdf 

Si) Jsl 
4 html 


Summary 


In this chapter we have learned about implementing a simple search interface using 
ZendSearch\Lucene. This would be very useful when implementing search in any web 
application that you work with. In the next chapter we will be learning about implementing 
a simple e-commerce store using Zend Framework 2.0. 
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Over the last few years e-commerce has evolved from just online 
advertisements to providing fully functional shopping experiences online. More 
and more products and services are being made available online everyday 
through the use of various online payment systems. The role of e-commerce 
applications and payment gateways has become crucial in this environment. 





In this chapter we will be building a simple online store to demonstrate the process 
involved in setting up a simple shopping cart. We will be using PayPal Express Checkout as 
our payment processer during this example. Some of the key topics that will be covered in 
this chapter include: 

Setting up a shopping cart 

Creating a online store administration interface 


Configuring Zend Framework 2.0 for PayPal 


An introduction to PayPal Express Checkout 
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Creating a Simple Store 


One of the first things that have to be designed while setting up an online store is the 
shopping cart. The shopping cart should ideally allow the end user to choose and add 
multiple products to the cart and be able to check out from the website. 


The checkout process is outlined as follows: 


1. Customer visits the product listing page. 
2. Customer selects a product; he/she is taken to the product detail page. 


3. Customer then chooses to purchase the product; customer is expected to add the 
desired quantity to the cart. 


4. Customer is redirected to the shopping cart page; here the customer may make any 
changes to the order if necessary. 


Customer chooses the mode of payment and enters the payment information. 
If successful, the customer is presented with an option to update the shipping details. 


Customer then confirms the order. 


OO: at. Oe OI 


The order is received at the retailer; the retailer then goes ahead and processes 
the order. 


So let's get started and create our store front; our next step will be to design a table 
structure which will support this store. For this we create the following two tables: 


@ store products: This table will store all product related information 


@ store orders: This table will store all order-related information 


Time for action — creating a store front 





For simplicity, we will shorten the Checkout process by skipping some steps. We have 
modified the process so that we can only have one product per order; we will also skip 
the updating of shipping details and the customer order confirmation steps: 


1. Create tables to hold the products and orders data: 


CREATE TABLE IF NOT EXISTS store products ( 
id int(11) NOT NULL AUTO INCREMENT, 
name varchar(255) NOT NULL, 
desc varchar(255) NOT NULL, 
cost float(9,2) NOT NULL, 
PRIMARY KEY (id) 
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CREATE TABLE IF NOT EXISTS store orders ( 


E 


id int (11) NOT NULL AUTO INCREMENT, 
store product id int (11) NOT NULL, 
aty int(11) NOT NULL, 

total float(9,2) NOT NULL, 

status enum('new', 'completed', 

'shipped', 'cancelled') DEFAULT NULL, 
stamp timestamp NOT NULL DEFAULT CURRENT TIMESTAMP, 
first name varchar(255) DEFAULT NULL, 
last name varchar(255) DEFAULT NULL, 
email varchar(255) DEFAULT NULL, 
ship to street varchar(255) DEFAULT NULL, 
ship to city varchar(255) DEFAULT NULL, 
ship to state varchar(2) DEFAULT NULL, 
ship to zip int(11) DEFAULT NULL, 

PRIMARY KEY (1d) 


Create entities for StoreOrder and StoreProduct, and also create necessary 
table gateway objects for data access. 


Create a StoreController controller, which will be used as our shopping cart. 


StoreController will support the following actions: 


a indexAction(): This action will list all products in the website 


a productDetailAction(): This will display the details of a specific 
product; this will also allow the customer to add a product to the cart 


a shoppingCartAction(): This action is used to render the shopping cart 
before leaving for the payment processing page 


Q paypalExpressCheckoutAction (): This action will redirect the user to 
the PayPal Express Checkout page 


QO paymentConfirmAction(): This action will handle the redirection from 
PayPal Express Checkout back to the shopping cart upon successful payment 


Q paymentCancelAction (): This action will handle the redirection from 
PayPal Express Checkout back to the shopping cart upon failed payment 


Create the necessary views to display the content of the shopping cart. 


6. Add the necessary methods to StoreOrder to calculate the order total upon 
adding items to the orders. 
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7. The final user interface should look like the following screenshot. The product listing 
page lists all products in the website/category; in this case, the two test products are 


listed in the following screenshot: 


2, a 5 
Bianlaeslaa alfa 3 Tinan i 1 alalila = TIA 
it ‘at A Aaa d hail a "haa 


hen as ha fia 


Products 


Test Product 1 
Description of Test Product 1 


Cost: $7.50 


View Product 
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eStore 


Test Product 2 
Description of Test Product 2 


Cost: $10.00 


View Product 





The product detail page allows users to view details of a product, and also add the specified 


quantity to the shopping cart: 


Product Info 


Test Product 1 


Description of Test Product 1 


Cost: $7.50 





Quantity 





Purchase | 
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The Shopping Cart page lists all products that are added to the cart along with their unit 
price, quantity, and subtotal: 


eStore 


Shopping Cart 


Unit Cost 
Test Product 1 7.50 








Payment Options 


Wy CHECKOUT 


— NOW 


ly 
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What just happened? 


We have created a shopping cart interface for our new store; we will be modifying this 
interface further in order to add support for the payment processor. But before we get to 
that stage, let's create a simple store administration interface to enable us to manage the 
store and orders. 


The store administration 


The store administration user interface is used to check the status of orders once they are 
created and also to manage the list of products that are available for sale in the store. There 
are two key aspects for the store administration user interface: 


@ The administrator should be able to add, remove, and manage products 


@ The administrator should be able manage order and change statuses using 
this interface 
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Time for action — creating the Store Admin interface 





Perform the following steps for creating the Store Admin interface: 


1. Create a new controller for store administration, and name it 
StoreAdminController. 


2. This controller will have the following basic actions: 


E 


m 


m 


m 


indexAction (): Used for listing all products 
addProductAction (): Used for adding a new product 
deleteProductAction (): Used for deleting an existing product 
listOrdersAction (): Used for listing all orders 
viewOrderAction (): Used for viewing a specific order 


updateOrderStatusAction (): Used for updating order status 


3. Create the necessary views, and map the actions accordingly. 


4. Open phpMyadmin and create test records in both the store products and 
store orders tables to test the functionality for the administration UI. 


5. Open your favorite browser, log in to the application, and open the eStore Admin 
interface. The interface should look like the following one. 


The Manage Products page lets you add, remove, and edit products from the 
administration interface: 


eStore Admin y Logout 


View Products | View Orders 


Manage Products 


Product Name Description Actions 


Test Product 1 Description of Test Product 1 j Modify | Delete 


Test Product 2 Description of Test Product 2 Modify | Delete 


Add Product 
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The orders listing page lists all orders placed in the store and allows you to view orders and 
modify their statuses: 


View Products | View Qlhrjers 


Store Orders 


Date Status Actions 

2013-04-01 21:38:30 9. cancelled View Order 
2013-04-02 08:25:58 cancelled ew Order 
2013-04-03 21:20:49 cancelled View Order 
2013-04-03 22:16:15 5. cancelled View Order 
2013-04-03 22:36:32 cancelled ew Order 
2013-04-03 22:40:59 shipped View Order 


2013-04-03 22:44:37 completed ew Order 





2013-04-04 00:36:31 new ew Order 
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A screenshot of the Order Information page listing the order information and providing 
options to change their status is shown as follows: 


View Products | View Orders 


Order Information 


Order Num # 11 


Status : completed 


Shipping/Billing Information 





Test User 
zendframework2development@gmail.com 





Order Details 
Unit Cost Total 
Test Product 2 | 10.00 20.00 


Update Order Status 








Set as New | Set as Complete | Set as Shipped | Set as Cancelled 
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What just happened? 


The store administration UI is now ready, and our next step is to set up PayPal Express 
checkout and to integrate it with our store, which will enable our user to make payments 
using PayPal. Before we move on to the next section, the following section gives you a simple 
task to try out. 


Now that you know how to integrate search into a Zend Framework 2.0 application, try to 
add free text search functionality for the Manage Products section of our store application. 


Payments with PayPal 


PayPal is the most commonly used payment processor across the world; one of the key 
contributors to PayPal's success is its easy-to-use API and exhaustive documentation that 
supports this payment gateway. For any new merchant, PayPal offers a wide range of options 
for setting up their payment processor, the most important being the types of integrations that 
are offered. PayPal offers various products under Payment Processing; some of them include: 


@ Express Checkout 
@ PayPal Payments Standards (Website Payments Standards) 
@ PayPal Payments Pro (Website Payments Pro) 


We will be working with Express Checkout in this chapter, since it is the most basic 
implementation method of PayPal. 


PayPal and Zend Framework 2.0 


At the time of writing this book, there were no native packages that were offered by Zend 
Framework which supported PayPal integration. There are always third-party options that 
support this integration. In this example, we have made use of one such third party package 
called SpeckPaypal. 
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Time for action — setting up PayPal 


Perform the following steps for setting up PayPal: 


1. 
2. 


Open https: //packagist.org/, search for speckpaypal. 
Get the repository details. 


3. Modify the application's Composer configuration file to include the speckpaypal 


repository: 

"require": { 
TORPE VSS. aa 
"zendframework/zendframework": "2.0.*", 
"webino/webino-image-thumb": "1.0.0", 
"zendframework/zendgdata": "2.*", 
"speckcommerce/speck-paypal": "dev-master" 


} 


Update the project dependencies using the Composer update: 


Loading composer repositories with package information 
Updating dependencies 

- Removing zendframework/zendframework (2.0.7) 

- Installing zendframework/zendframework (2.0.8) 


Downloading: 100% 


- Installing speckcommerce/speck-paypal (dev-master d951518) 


Cloning d951518£fd2c98148da5609e23a41697e6c£caN6e 


Writing lock file 


Generating autoload files 


Now we will need API credentials for accessing PayPal Express Checkout. 


This can be accessed by logging into https: //developer.paypal.com 


with your PayPal credentials. 


Open Sandbox Accounts from Applications. 
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7. Choose the appropriate merchant account and select API Credentials in Profile. 


| Account details 


Profile AFI credentials Funding Settings 


Classic TEST API credentials 
Usemame: Zf2book-facilitator_ a pit -9 mail- com 
Password: 12233445566 


signature:  ZXIK4AQoYDOVmaNMNKAOLPS3425BKAWELjgKHDO 
AatugckW23EGML.KEJ 





Go 


Make a note of the API credentials. 


so 


Now create a new configuration in the config file (CommunicationApp/module/ 
Users/config/module.config.php) in the module's configuration file and 
name the array index speck-paypal-api: 


'speck-paypal-api' => array ( 


‘username! => !'', 
'password' => '', 
‘Signature’ => **, 
'endpoint' => 'https://api-3t.sandbox.paypal.com/nvp' 


) 


10. Different PayPal services have different end points. For Express Checkout in Sandbox 
this is https: //api-3t.sandbox. paypal .com/nvp; if you are switching live/ 
production environment, this needs to be changed to https: //api-3t.paypal. 
com/nvp. 


What just happened? 


Now we have configured PayPal and SpeckPaypal in our application, our next step is to test 
receiving payments using PayPal Express Checkout. 
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PayPal Express Checkout 


PayPal Express Checkout allows sellers to receive credit card / PayPal payments on their 
websites by redirecting them to PayPal Express Checkout for secure web payment and 
returning them back to the merchant's website once the transaction is completed. 


The workflow is explained as follows: 


1. 


Customer on the Shopping Cart page chooses to pay by PayPal Express Checkout; 
the merchant calls the SetExpressCheckout API call and gets the payment token. 


Using the Payment token, the customer is redirected to the PayPal Express Checkout 
login page; here the customer can enter his/her PayPal login information or get a 
new PayPal account. 


On the next page, the customer is presented with a Review option to review the 
payment information before proceeding to continue the checkout with the merchant. 


Now the customer is redirected back to the merchant page; the merchant then calls 
the GetExpressCheckoutDetails API call and gets the customer information. 
The customer reviews the order and confirms the order. The merchant then 
completes the payment request using the DoExpressCheckout Payment API call. 


The customer is shown the transaction results along with the order summary. 


a SetExpressCheckout 


Shopping 
Cart 


301 Redirect + Token 


Redirect 


4 GetExpressCheckoutDetails 
—— 


oii DoExpressCheckoutPayment 
Review — eo 


5 


Order 
Confirmation 
Page 





PayPal Express Checkout—overview 
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More about PayPal Express Checkout 

You can read more about PayPal Express Checkout at the PayPal website 
A! https ://www.paypal.com/webapps/mpp/express-checkout. 
Q Developer documentation on PayPal Express Checkout is available at: 


https://developer.paypal.com/webapps/developer/ 
docs/classic/express-checkout/integration-guide/ 
ECGettingStarted/. 


Time for action — accepting payments using PayPal 


Preform the following steps for accepting payments using PayPal: 





1. Now adda button on the Shopping Cart page (optionally with Checkout by PayPal 
Image). This button should link to the paypalExpressCheckoutAction () function. 


2. Adda method in the store controller which will be used to generate the 
PayPal request: 


protected function getPaypalRequest () 
{ 
Sconfig = Sthis->getServiceLocator()->get('config') ; 
SpaypalConfig = new \SpeckPaypal\Element\Config ( 
Sconfig['speck-paypal-api']) ; 


Sadapter = new \Zend\Http\Client\Adapter\Curl (); 
Sadapter->setOptions (array ( 
'curloptions' => array ( 
CURLOPT SSL VERIFYPEER => false, 
) 
Ar 


$client = new \Zend\Http\Client; 
Sclient->setMethod('POST') ; 

Sclient->setAdapter (Sadapter) ; 

SpaypalRequest = new \SpeckPaypal\Service\Request; 
SpaypalRequest->setClient (Sclient) ; 


SpaypalRequest->setConfig(SpaypalConfig) ; 


return SpaypalRequest ; 
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3. Modify the paypalExpressCheckoutAction() function to send the order 
information to PayPal and redirect the user to PayPal Express Checkout: 


public function paypalExpressCheckoutAction () 


{ 


Srequest = Sthis->getRequest () ; 
SorderId = Srequest->getPost ()->get('orderId') ; 
SorderTable = Sthis->getServiceLocator () - 


>get ('StoreOrdersTable') ; 
Sorder = SorderTable->getOrder (SorderId) ; 


SpaypalRequest = Sthis->getPaypalRequest () ; 


SpaymentDetails = new \SpeckPaypal\Element\PaymentDetails 

(array('amt' => Sorder->total 

ee. 

Sexpress = new \SpeckPaypal\Request\SetExpressCheckout ( 
array ('paymentDetails' => SpaymentDetails) 


Ps 


Sexpress->setReturnurl ( 
'http://comm-app.local/users/store/paymentConfirm') ; 

Sexpress->setCancelUrl ( 
'http://comm-app.local/users/store/paymentCancel'); 


// Send Order information to PayPal 
Sresponse = SpaypalRequest->send(Sexpress) ; 
$token = Sresponse->getToken() ; 


SpaypalSession = new \Zend\Session\Container('paypal') ; 
SpaypalSession->tokenId = Stoken; 
SpaypalSession->sorderId = SorderId; 


// Redirect user to PayPal Express Checkout 


Sthis->redirect () ->toUrl ('https://www.sandbox.paypal.com/ 
webscr?cmd= express-checkouté&token=' . $token) ; 
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4. Add a method to handle successful payment from Express Checkout— 
payment ConfirmAction(); this method will capture the payment information 
from PayPal, confirm the payment, and then update the order status in our system 
using the code as shown in the following list: 


a Capture payment information from PayPal: 


// To capture Payer Information from PayPal 
SpaypalSession = new \Zend\Session\Container('paypal') ; 
SpaypalRequest = Sthis->getPaypalRequest () ; 


SexpressCheckoutInfo = 


new \SpeckPaypal\Request\ 
GetExpressCheckoutDetails(); 


SexpressCheckoutInfo->setToken (SpaypalSession->stokenlId) ; 
Sresponse = SpaypalRequest->send(SexpressCheckoutInfo) ; 


a Confirm order with PayPal: 


//To capture express payment 
SorderTable = Sthis->sgetServiceLocator () - 
>get ('StoreOrdersTable') ; 


Sorder = SorderTable->getOrder (SpaypalSession-sorderId) ; 


SpaymentDetails = new \SpeckPaypal\Element\ 
PaymentDetails (array ( 


'amt' => Sorder->stotal 


DE 


$token = Sresponse->getToken() ; 
SpayerlId = Sresponse->getPayerld() ; 


ScaptureExpress = new \SpeckPaypal\Request\ 
DoExpressCheckoutPayment ( 


array ( 
'token' => $token, 
'payerld' => Spayerld, 
'paymentDetails' => SpaymentDetails 
))3 
SconfirmPaymentResponse = SpaypalRequest- 


>send (ScaptureExpress) ; 


a Save order with updated shipping/billing information: 


//To Save Order Information 

Sorder->first name = Sresponse->getFirstName () ; 
Sorder->last name = Sresponse->getLastName() ; 
sorder=sship. to Street- -= Sresponse-sgershiploserect (4 
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SOLdEr=Sship to city = Sresponse=sgetShiprocity() ; 
Sorder->ship to state = Sresponse->getShipToState(); 
Şorder->ship to zip = Sresponse=sgetShipTozip |) ; 


Sorder->email = Sresponse->getEmail (); 
Ssorder->store order id = SpaypalSession->orderIid; 
Sorder->status = 'completed'; 


SorderTable->saveOrder (Sorder) ; 


5. Finally add a method to handle failed payment from Express Checkout— 
paymentCancelAction(): 


public function paymentCancelAction () 


{ 


SpaypalSession = new \Zend\Session\Container('paypal') ; 


SstoreOrdersTG = Sthis->getServiceLocator () 
->get ('StoreOrdersTableGateway' ) ; 

SstoreOrdersTG- >update ( 

array('status' => 'cancelled'), 

array('id' => SpaypalSession->sorderId) ); 
SpaypalSession->orderId = NULL; 
SpaypalSession->tokenId = NULL; 
Sview = new ViewModel () ; 
return Sview; 


} 


6. Nowloginto https: //developer. paypal .com again. 
7. Generate a new sandbox account of type PERSONAL. 


8. Now access the store and try to purchase using the newly created Sandbox account. 
The final store should look like the following screenshot: 


eStore 


Shopping Cart 


| Unit Cost 
Test Product 2 10.00 








Payment Options 


Check out PayPal. 


The safer, easier way to pay 
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After choosing the checkout from the Shopping Cart page, you will be redirected to 
the Pay with my PayPal account login page as shown in the following screenshot: 


Choose a way to pay 
Your order summary 


Descriptions 2 
¥ Pay with my PayPal account 


Pe Log in to your account to complete the purchase 


You'll be able to see your order details Email 


before you pay. 
eee zendframework2development¢ 


PayPal password 


rs 
Login 


Forgot your email address or password? 


And pay with your debi or credit card 


Cancel and return to Krishna Shasankars Test Store. 
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A screenshot of the PayPal Express Checkout's order reviewing page is shown in the 


following screenshot; this page is used to review the payment that is being made to 
the merchant from the customer's PayPal account: 


Review your information 
Your order summary 


Descriptions 


Current purchase -Continue | 


You'll be able to see your order details Shipping address 8 Change 
before you pay. 


Test User 

1 Main St 

San Jose, CA 95131 
United States 


Note to seller: Add 


Payment methods # Change 


PayPal Balance 


© PayPal gift card, certificate, reward, or other discount Redeem 
View PayPal policies and your payment method rights. 


Contact information 
zendframework2development@gmail.com 


You're almost done. You will confirm your payment on Krishna Shasankars Test Store 


Cancel and return to Krishna Shasankar's Test Store. 
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Once the order is successfully placed, the user is redirected to the order 
confirmation page as shown in the following screenshot: 


Payment Confirmed 


Order Num # 29 


Status : completed 


Shipping/Billing Information 





Test User 
zendframework2development@gmail.com 
1 Main St 


Order Details 


eStore 





Name Qty Unit Cost Total 
Test Product 2 6 10.00 60.00 
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9. 


are credited: 
Account Limits: View Limits 


PayPal balance: $173.88 USD 


My recent activity | Payments received 


Payments sent 


My recent activity - Last 7 days (Mar 31, 2073-Apr 7, 2073) 


Archive 


Date Type 


Apr T, 2013 


Payment From 
Apr 7, 2013 Fayment From 


Apr 7, 2013 Fayment From 


Archive 


Name/Email 


Test User 


Test User 


Test User 


Payment status 
Completed 
Completed 


Completed 
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Now log in to the Sandbox site for the merchant account to see if the payments 


View all of my transactions 


Payment status glossary 


Details Order status/Actons Gross 


Details Issue refund $60.00 USD 


Details Issue refund $60.00 USD 


Details | Issue refund 260.00 USD 
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What just happened? 


We just used PayPal Express Checkout to receive payments in our web application and 
complete the simple store application. As you can see, the PayPal API makes it relatively 
easy to set up the payment gateway. 





In your next task, make use of the DoDirectPayment API call to directly make a payment 
on the website without having to redirect the user to the PayPal website and back again. 


Q1. Which of the following methods is used to send the initial payment information for 
PayPal redirection? 

RedirectExpressCheckout 

SetExpressCheckout 

GetExpressCheckoutDetails 


go Ee es 


DoExpressCheckout Payment 
Q2. Which of the following fields is needed for requesting payment information from PayPal? 


token 
payerld 


paymentDetails 


oN oe ee ee 


orderID 


Summary 


In this chapter we have learned the basics of setting up a simple store online and trying 

to receive payments using PayPal. As you can see from the previous example, Zend 
Framework's use of modules simplifies application development by giving developers the 
ability to download and install external third-party modules based on their integration needs. 
In the next chapter, we will be working on HTML5 development with Zend Framework 2.0. 
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HTMLS Support 


HTMLS is the latest version of HTML specification; the final draft is not likely to 
be completed anywhere soon, but most browsers support a majority of features 
that are specified in the latest working draft. 


Some of the most important offerings of HTMLS5 are listed as follows: 


©% © ©% «©¢ 


+ 


Audio and video tags 

CSS3 support 

Support for drawing graphics using SVG and CSS3 2D and 3D 
Local storage, Web/JS workers, and geo location 


HTML5 form elements 


For the scope of this book, we will be more focused on new form elements. HTML5 
introduces a lot of new form elements. In previous versions of HTML, web developers were 
limited to use just the standard input types provided in the earlier HTML specifications. Now 
with the HTMLS specification, we have different elements for various different user inputs. 


HTML5 Support 
The list of newly available input elements is listed as follows: 


datetime 
datetime-local 
time 
date 
week 
month 
email 
url 
number 
range 
color 


tel 


+% ©% ©% >% >% 1 >% 1H FH HO HOH OH 


search 


HTML5 specification 


: For further reading, please refer to the HTML5.0 specification available 
Q on the W3C website: http: //www.w3.org/TR/htm15/. 


The following link points to specification for the <input > element: 


http://www.w3.org/TR/htm15/forms.html#the-input- 
element 


In this chapter we will understand the usage of these input elements. 


HTMLS input elements 


Zend Framework 2.0 now supports all of the newly specified HTML5 input types; these 
inputs are available under Zend\Form\Element like any other input types. The following 
table describes each of these elements along with their class names: 
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Input type Description 
datetime @ Element: Zend\Form\Element\DateTime 


@ Used to render the Date/Time Element input field with the time 
zone set to UTC 


@ HIMLtag: <input type="datetime" name="element- 
date-time"> 


@ The datetime element rendered in Opera 12.0 is shown in the 
following screenshot: 


Date/Time Element 


4 
11 
18 
25 





datetime-local Element: Zend\Form\Element\DateTimeLocal 


+ 


@ Used to render the Date/Time Local Element input field for the 
client browser's time zone 


@ HIMLtag: <input type="datetime-local" 
name="element-date-time-local">s 


@ The datetime-local element rendered in Opera 12.0 is shown 
in the following screenshot: 


Date/Time Local Element 





Wed Thu Fri Sat Sun 
3 4 6 T 
10 11 


17 18 
24 25 
31 
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Input type 


time 


date 





Description 
@ Element: Zend\Form\Element\Time 
@ Used to render the Time Element field 
@ HIMLtag: <input type="time" name="element-time"> 
@ The time element rendered in Opera 12.0 is shown in the following 
screenshot: 
Time Element 
11:45 = 
@ Element: Zend\Form\Element \Date 
@ Used to render the Date Element field 
@ HIMLtag: <input type="date" name="element-date"> 
@ The date element rendered in Opera 12.0 is shown in the following 


screenshot: 


Date Element 


July 
Mon Tue Wed Th ri Sat Sun 
2 3 f: 6 f 
g 10 12 13 


16 1r 
23 
30 
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Input type Description 

week @ Element: Zend\Form\Element \Week 
@ Used to render the Week Element field 
@ HIMLtag: <input type="week" name="element-week"> 
+ 


The week element rendered in Opera 12.0 is shown in the following 
screenshot: 


Week Element 


«| July 
Week Mon Tue Wed Thu 
2 i 2 3 4 
10 11 
17 


24 





month @ Element: Zend\Form\Element \Month 
@ Used to render the Month Element field 


@ HIMLtag: <input type="month" name="element- 
months 


@ The month element rendered in Opera 12.0 is shown in the 
following screenshot: 


Month Element 


| 2013-07 


al July 


Mon Tue Wed Thu 
2 3 4 
10 11 


if 18 
24 
31 
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Input type 


email 


url 


number 


range 


Description 


+ 


©% ©% >% >% ọọ% Hm 


+ 


Element: Zend\Form\Element \Email 
Used to render the Email input field 


HTML tag: <input type="email" name="element- 
email"> 


Element: Zend\Form\Element \Url 

Used to render the URL input field 

HTML tag: <input type="url" name="element-url"> 
Element: Zend\Form\Element \Number 

Used to render the Number Element input field 


HTML tag: <input type="number" name="element- 
number" > 


The number element rendered in Opera 12.0 is shown in the 
following screenshot: 


Number Element 


Element: Zend\Form\Element \Range 





Used to render the Range Element input field using slider control 


HTML tag: <input type="range" name="element- 
range"> 


The range element rendered in Opera 12.0 is shown in the 
following screenshot: 


Range Element 
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Input type Description 


color 


Time 


@ Element: Zend\Form\Element \Color 
@ Used to render the Color Element input field with a color picker 


@ HIMLtag: <input type="color" name="element- 
dolor™s> 


@ The color element rendered in Opera 12.0 is shown in the 
following screenshot: 


Color Element 
E ES EEE 
EE i E 


Fedic24 
Other... 


for action —HTML9S input elements 





In this example we will be creating a test HTML5 form for rendering various types of HTML5 
input elements: 


1. 


Create a test action for rendering the form element formAction(); it can be 
created under the new controller Html15TestController - module/Users/ 
src/Users/Controller/Htm1l5TestController.php. 


Add references to Zend\Form\Form and Zend\Form\Element: 


use Zend\Form\Element ; 
use Zend\Form\Form; 


Add various HTMLS5 form elements to the form: 


Sform = new Form(); 


// Date/Time Element 
SdateTime = new Element\DateTime('element-date-time') ; 
SdateTime 
->setLabel ('Date/Time Element') 
->setAttributes (array ( 
'min' => '2000-01-01T00:00:00Zz', 
'max' => '2020=01-=0LT00:00:0024', 
'step'! => !'1', 
DE 
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Sform->add(SdateTime) ; 


// Date/Time Local Element 
SdateTime = new Element\DateTimeLocal ('element-date-time-local') ; 
SdateTime 
->setLabel ('Date/Time Local Element') 
->setAttributes (array ( 
'min' => '2000-01-01T00:00:00Zz', 
'max' => '2020-01-01T00:00:00Zz', 
'step'! => !'1', 
PIS 
Sform->add(SdateTime) ; 


// Time Element 

Stime = new Element\Time('element-time') ; 
Stime->setLabel ('Time Element'); 
Sform->add(Stime) ; 


// Date Element 
Sdate = new Element\Date('element-date') ; 
Sdate 
->setLabel ('Date Element') 
->setAttributes (array ( 
'min' => '2000-01-01', 
'max ' => '2020-01-01', 
'step'! => !'1', 
PI? 
Sform->add(Sdate) ; 


// Week Element 

Sweek = new Element\Week('element-week') ; 
Sweek->setLabel ('Week Element'); 
Sform->add(Sweek) ; 


// Month Element 

Smonth = new Element\Month('element-month') ; 
Smonth->setLabel ('Month Element') ; 
Sform->add(Smonth) ; 


// Email Element 


Semail = new Element\Email('element-email') ; 
Semail->setLabel ('Email Element') ; 
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Sform->add(Semail) ; 


// URL Element 

Surl = new Element\Url1('element-url') ; 
Surl->setLabel('URL Element'); 
Sform->add(Surl) ; 


// Number Element 

Snumber = new Element\Number ('element-number') ; 
Snumber->setLabel ('Number Element') ; 
Sform->add(Snumber) ; 


// Range Element 

Srange = new Element\Range('element-range') ; 
Srange->setLabel ('Range Element') ; 
Sform->add(Srange) ; 


// Color Element 

Scolor = new Element\Color('element-color') ; 
Scolor->setLabel('Color Element'); 
Sform->sadd(Scolor) ; 


What just happened? 


We have created a simple form purely using HTML5 elements that are supported by Zend 
Framework 2.0. The form in its current shape can be rendered by creating the necessary 
view. Our next task will be to build the view for this form with the use of HTML5 helpers and 
render all the form elements that were added to the form. 


HTMLS view helpers 


Zend Framework provides view helpers for rendering all the form elements described in the 
previous section. The formElement () view helper can be used to render any kind of input 
dynamically based on the input type, however it is not the suggested practice. 
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The following table gives you the list of standard HTML5 helpers available for the HTML5 


input elements: 


Input type 


Helper 


Helper function 
Zend\Form\View\Helper\ 


datetime 


datetime- 
local 


time 
date 
week 
month 
email 
urt 
number 
range 


color 


FormDateTime 


zend\Form\View\Helper\ 
FormDateTimeLocal 


zend\Form\View\Helper\FormTime 
Zend\Form\View\Helper\FormDate 
Zend \Form\View\Helper\FormWeek 
Zend\Form\View\Helper\FormMonth 
Zend\Form\View\Helper\FormEmail 
Zend \Form\View\Helper\FormUr1l 


Zend \Form\View\Helper\FormNumber 


Zend\Form\View\Helper\FormRange 


formDateTime () 
formDateTimeLocal () 


() 
formDate () 
formWeek () 
formMonth () 


formTime 


formEmail () 
formUrl () 

fFormNumber () 
fFormRange ( ) 


formColor () 


Zend \Form\View\Helper\FormColor 


Apart from the standard list of view helpers, Zend Framework also provides helpers for 
the tel and search input types; these input types are an extension of the text input, 
but certain browsers (especially mobile browsers) support stylized input options in both 


these elements. 


The following table gives you the list of additional HTML5 helpers available for the HTML5 


input elements: 


Input type 


Helper 


Helper function 


tel 


Zend \Form\View\Helper\FormTel 


search 


formTel () 


formSearch () 


Zend\Form\View\Helper\FormSearch 


Time for action —HTMLS view helpers 





In this task we will render all the form elements that we created in the previous task. 
We will make use of ZF's HTML5 view helpers to render these elements. Perform the 


following steps: 


1. Create a simple view that can be used to render the form. 


2. Make use of view helpers to render various form elements using the following code: 


Sthis->formDateTime (S$form-sget ('element-date-time') ) ; 


Sthis->formDateTimeLocal (Sform->get ('element-date-time-local') ); 


Sthis->formTime (S$form->get ('element-time') ); 


[1681 


Chapter 9 


1 


Sthis->formDate ($form->get ('element-date') ) 
Sthis->formWeek (Sform->sget ('element-week') ) ; 
Sthis->formMonth(Sform->sget ('element-month') ) ; 
Sthis->formEmail (Sform->get ('element-email') ) ; 
Sthis->formUrl (Sform->sget ('element-url')); 
Sthis->formNumber (S$form-sget ('element-number') ) ; 
Sthis->formRange (Sform->get ('element-range') ) ; 


Sthis->formColor (Sform->sget ('element-color')); 


3. Test the form in an HTML5-compatible browser such as Opera 12. You should be 
able to see a form like the one shown in the following screenshot: 


@ Communication Application - Opera 


File Edit View Bookmarks Tools Help 





| Z> Communication Appli... 


pp.local/users/index/HTML5TestFo 


HTML5 Test Form 


HTML5 Test Form 
Date/Time Element 


Date/Time Local Element 


5l 


Time Element 
Date Element 
Week Element 
Month Element 
Email Element 
URL Element 
Number Element 


Range Element 


Color Element 


| Submit 
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4. Now, test the same form in an HTML5 non-compatible browser such as IE 9. 
You should be able to see a form like the one shown in the following screenshot. 
You can see that the unsupported input elements are replaced with textboxes: 


Communication Application 


HTML5 Test Form 


HTML5 Test Form 
Date/Time Element 


Date/Time Local Element 
Time Element 

Date Element 

Week Element 

Month Element 

Email Element 

URL Element 

Number Element 

Range Element 


Color Element 





Submit 














What just happened? 


We have created our first HTML5 form using ZF2 form elements. As of now, Opera 12 offers 
the best support for HTML5; other browsers such as Chrome and Safari are also good in 
terms of support. So, if you are testing your HTML5 forms, make sure that you are testing 
them in a browser that is compatible, such as Opera 12. 
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HTML5 browser compatibility 


Support for HTML5 specifications is inconsistent among various 
browsers; Opera and Chrome seem to offer best support in terms of 
compliance, but none of them are fully compliant. With each new 
browser version, there is additional support for these features. There are 


many resources available on the Internet that allow you to check your 


browser's compatibility with HTML5. 


http://html5test.com/ is a portal that ranks and compares 
browsers based on their HTML5 support. 


http: //caniuse.com/ is also a great website that lets users check 
if they can use a specific HTML5 feature on a specific browser. 


Here is a simple task for you before you move on to using advanced HTML5 attributes. Now 
that you have created a form using all the standard HTML5 elements, try to extend the form 
by using the view helpers to render the tel and search type inputs. 


HTML attributes 


You might have noticed in the beginning of the chapter that we were using new 
attributes such as min, max, and step. These are new attributes that are defined 

in the HTML5 specification that allow developers to specify additional configuration 
on the input element. Some important attributes are discussed in the following list: 


@ max: Applicable to the Number, Range, and Date fields; allows specification of 
maximum value in the input. 


@ min: Applicable to the Number, Range, and Date fields; allows specification of a 
minimum value in the input. 


@ step: Applicable to the Number, Range, and Date fields; allows specification of an 
increment value in the input. 


@ list: Applicable to various textbox style inputs. Allows developers to map the field 
to a data list, thus allowing end users to pick them from the list. 


@ placeholder: Applicable to various textbox style inputs. Allows developers to 
show placeholder text until the element gains focus. 


@ pattern: Applicable to various textbox style inputs. Allows developers to validate 
the user input against a regular express-and-throw-a-validation error. 
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@ required: Prevents users from submitting the form with empty values in the 
required fields. 


@ multiple: Applicable to file input; allows multiple file uploads from a single 
file control. 


For implementing multiple file uploads, you will need to set the multiple attribute on the 
file input element to TRUE. If the browser supports multiple file uploads, then the user will 
be allowed to select multiple files, otherwise the control will limit to just one file selection. 


Time for action —HTML3 multiple file uploads 





Perform the following steps for HTML5 multiple file uploads: 


1. Create anew ImageUpload form; make sure that the multiple attribute for the 
File element is set to TRUE: 


<?php 
// filename : module/Users/src/Users/Form/MultiImageUploadForm. php 
namespace Users\Form; 


use Zend\Form\Form; 
use Zend\Form\Element ; 
use Zend\InputFilter; 


class MultiImageUploadForm extends Form 


{ 


public function construct ($name = null, Soptions = array ()) 
{ 
parents “construct ($name, $options); 
Sthis->addElements () ; 
Sthis->addiInputFilter () ; 


public function addElements () 
{ 
Simageupload = new Element\File('imageupload') ; 
Simageupload->setLabel ('Image Upload') 
->setAttribute('1id', 'imageupload') 
->setAttribute('multiple', true); 
//Enables multiple file uploads 
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Sthis->add(Simageupload) ; 


Ssubmit = new Element\Submit ('submit'); 
Ssubmit->setValue('Upload Now') ; 
Sthis->add(Ssubmit) ; 


public function addInputFilter () 
{ 
SinputFilter = new InputFilter\InputFilter() ; 
// File Input 
SfileInput = new InputFilter\FileInput ('imageupload') ; 
SfileInput->setRequired (true); 
SfileInput->getFilterChain () ->attachByName ( 
'filerenameupload', 
array ( 
'target' => './data/images/temp.jpg', 
'randomize' => true 
) 
) 3; 
SinputFilter->add(S$fileInput) ; 
Sthis->setInputFilter (SinputFilter) ; 


Zend \Filter\File\RenameUpload 

al The RenameUp1load filter is used to rename and move the uploaded 
file to a new path specified in the target. To find out more please refer 
to the framework documentation at http: //framework.zend. 
com/manual/2.2/en/modules/zend.filter.file.rename- 
upload.html. 


2. Setup an action to handle the file uploads, and to redirect the user to an upload 
confirmation page: 
public function multiUploadAction () 
{ 
// prepare form 
$form = Sthis->getServiceLocator () ->get ('MultilImageUploadForm' ) ; 
Srequest = Sthis->getRequest () ; 
if (Srequest->isPost()) { 
Spost = array merge recursive ( 
Srequest->getPost ()->toArray(), 
Srequest->getFiles() ->toArray () 
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k3 
Sform->setData(Spost) ; 
if (Sform->isValid()) { 
Sdata = Sform->getData() ; 
// Form is valid, save the form! 
return Sthis->redirect () ->toRoute('users/html5-test', 
array('action' => 'processMultiUpload') ) ; 


} 
} 


SviewModel = new ViewModel (array('form' => $form) ); 


return SviewModeli ; 


} 


3. Now test the form in your browser that supports multiple file uploads with HTMLS5, 
for example, Opera 12. You will see that the file selector interface allows the 
selection of more than one file as shown in the following screenshot: 


Firefox Y 


& > comm-app.local/users/htm|5-test/multiUpload 


@ Disabler dh Cookies Y CSS [LJ Forms” Œ) Images” @ Info & Ele Upload 


ye m > Libraries » Pictures » Public Pictures >» Sample Pictures 
Sa] ———____________— — 


Se 


Organize v New folder 


H Favori ^ Pictures libra Sings a 
HTML5 Test Form i sa Se ry Arrange by: Folder 


m3 Downloads 





Multi Upload Test Form 


$7 Dropbox | 
Image Upload 5 


~| Recent Places 


Jellyfish 


LS Photo Stream Chrysanthemum | Penguins 





| Upload Now | | 


—————— Pry te, 
(oo Libraries 
© 2005 - 2012 by Zend Technologies Ltd. All rights +] Documents 


d — | | Hydrangeas Lighthouse 
| Pictures ar mST aoe eS 
# Videos 








EA Homegroup 


+ 


Filename: "Chrysanthemum" "Desert" "Tulips" "Hydrangeas" v |All Files 
e 
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4. After you choose Upload now and once the upload process is completed, you will 
see the confirmation page as shown in the following screenshot: 


hretox = | Z7 Communication Application 


& comm-app.local/users/html5-test/processMultilpload 


@ Disables gh, Cookies  CSS- [LJ Forms (i) Images Æ Information- [fj Miscellaneous" F Outlines € Resizer 


=, 1 j m a ~- 
i = Ly nication ‘ital = 
i St Í | kt I hus a be Lt S i 


HTML5 Test Form 


Multi Upload Test Form 
Upload Sucesstull 


© 203 - 2012 by Zend Technologies Lid. All rights reserved. 





5. You can verify if the files are uploaded successfully and the filters are applied by 
navigating through the data/images directory and looking up for the uploaded 
files. You can see that all files start with temp and havea <random_number> 
suffix in their filenames: 


unicationApp + CommApp + data + images 


ith ¥ Slide show Burn New folder 


i 


temp_51897bc73 temp 51897bc73 temp 51897bc73 — termp_5189/bc/3 
a30 b4bb 78b9 f1lf 
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Filters with multiple file uploads 
S 


a When applying filters with multiple file uploads, the filter(s) will be 
applied to all the files that are successfully uploaded with the same 
filter option settings. 


What just happened? 


We have now created an HTML5 multiple file upload form using HTMLS5 attributes and Zend 
form elements. We have also applied a filter to rename the uploaded files and have also 
seen how filters work in multiple file uploads. 


Pon quiz—HIMLS support 


Q1. Which of the following methods is a newly supported HTMLS5 input type? 


1. text 

2. radio 
3. checkbox 
4 


number 


Which of the following input types do not have a Form element defined in ZF 2.1? 


1. tel 

2. date 
3. Color 
4. search 


Summary 


HTMLS is a very robust and powerful specification of HTML which is still partially supported 
by most browsers. As newer versions of browsers come out in the market, you will get to see 
much more enhanced support for this specification. In our next chapter, we will be using ZF2 
to build mobile web applications. 
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One of the major hurdles in mobile application development is the diversified 
number of platforms that have to be targeted while building mobile 
applications. Platforms such as PhoneGap and Titanium enable developers to 
build cross-platform mobile applications, but one of the disadvantages with this 
model is to manage multiple projects on different platforms for mobile and web 
services. Zend, with the release of Zend Studio 10, has tried to address the same 
gap by providing a development platform based on PhoneGap, which supports 
end-to-end mobile apps in a cloud-based environment. 





With the release of Zend Studio 10, Zend now offers extremely simplified mobile application 
development platform using Zend Framework 2, known as Cloud Connected Mobile Tool. 
In this chapter we will be learning about the basics of building cloud-connected mobile 
applications using Zend Studio. Some of the key learning areas discussed are as follows: 

@ Building your first cloud-connected mobile (CCM) application 

@ Testing as a native application 


@ Implementing a simple search interface 


Zend Studio now offers a CCM tool enabling developers to build native mobile applications 
using the cloud platform. CCM supports development of RPC-based or REST-based web 
services for the cloud using Zend Framework 2 and Zend Server Gateway. 


Building Mobile Applications 


CCM also offers support for developing native mobile applications by integrating with 
various mobile SDKs (Android SDK/ADT for Android, Xcode for iOS, and Windows Phone 
SDK for Windows Phone). This enables developers to build and test the applications in 
native environments/devices. 


CCM tool also offers a simple and easy-to-use mobile GUI editor which helps developers to 
effortlessly build great user interfaces for their mobile applications. 


Zend Studio 10 


As a first step towards building your mobile application, please ensure that you install Zend 
Studio 10 on your development machine. Zend Studio 10 offers integrated support for 
building cloud-connected mobile applications and allows developers to deploy their mobile 
application on the cloud. 


Zend Studio 10 is available for purchase from the Zend Online Store; there is a free 
30-day trial as well. For further information visit http: //www. zend. com/en/products/ 
studio/. 


Zend Developer Cloud is a cloud-based PHP development environment, which enables 
developers to build and deploy applications on the cloud, without undergoing the 
hassle of setting up a PHP development environment, and configuring and maintaining 
the environment. 


This environment has Zend Framework 2 installed with a large set of PHP extensions; 
developers can make use of various development tools such as Zend Studio, Eclipse PDT, 
and CLI to build and deploy their applications on the developer cloud. Zend Developer Cloud 
also provides capabilities to push your application to other external cloud services such as 
Amazon and IBM SmartCloud. 


Zend Developer Cloud is currently in free developer beta. For further information about Zend 
Developer Cloud, please refer to their website: http: //www. phpcloud.com/. 


Time for action — configuring your phpCloud account 





In this task we will set up our phpCloud account and configure the cloud environment in 
Zend Studio 10 using the following steps: 


1. Visithttps://my.phpcloud.com/user/login, register for a new account, and 
log in to your phpCloud account. 
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2. After the login, you will be asked to create a container. You can specify a container 
name which will be a part of the container URL; you can also choose to generate a 
SSH key pair or use your own SSH keys; in this case, we will generate a new SSH key 
pair. The following screenshot describes the container creation screen: 


wide poms Create Container 


Access Keys 


- Field must start with a letter, be 4-16 characters long and contain Latin alphanumer 
My Containers | | | d IQ an tain | pnan Ier 


*Container Password: 


Get More Containers *Repeat Password: 


During beta period you can get *Access Keys: © Generate an RSA keypair and give me the private key 


free access to more than one 


application container! Upload an existing RSA public key in OpenSSH format 


Click here to manage your *Container Version. © Zend Server6-PHP 5.3 


Zend Server 6 - PHP 5.4 


containers and create a new 





container 


*Debugger Extension: ®@ Zend Debugger debug (Only with PHP 5.3 


Configure outgoing email server (SMTP) 
How do | 


Check this if you want to be able to send emails from your application 


Deploy my application code Create Container 


Access my MySQL database All fields with * are required. 
instance 


Debug my applicatic 


All help & tutorials » 





3. Now download the SSH keys; we will be using these keys to set up our deployment 
target in Zend Studio: 


New SSH Keypair created 


Please download your SSH key file and save itin a secure location. This is your private key, and 
it must remain secret. We will not store this key, and itis up to you to secure it. If this private key 
has been compromised or lost, you should revoke the keypair and create a new one. 


ae Linux / MacOS X users: for security reasons you must run *chmocd 600° on the file 
immediately after downloading it. 


yr Download private key in PPK Format 
for use with WinSCP and PuTTY on Windows 


K 
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4. In Zend Studio, navigate to Window | Show View | Targets: 


fii Problems El Console wl Remote Systems gl Targets 





5. Click on the Add Target icon and choose phpcloud as shown in the following 
screenshot: 


Add Target 
Add Target 
Select target type. 


Create a New Target: 


zend 
Server 


fend Server phpcloud OpenShift Detect Local 




















| Next> | | Cancel Finish 





6. On the phpcloud Target Details page, you will be asked to provide the 
following details: 


a Username: Used to specify your Zend Developer Cloud username 


a Password: Used to specify your Zend Developer Cloud password 
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a SSH Private Key: Used to point to the SSH key that was just generated in the 
phpcloud container creation screen 


Add Phocloud Target 


Phpcloud Target Details 
Specify target details. 


Username: zf2 .book@gqmail.com 


Password: PoP CPP eT ere eee ere | Restore 


SSH Private Key: | /Users/krishna/.ssh/id_rsa | Browse Generate 


In order to debug and connect to your container without a password, you need to specify a 


SSH private key that enables authentication via asymmetric cryptography. You can either 
browse to an existing key or generate a new one. 


Cancel 





7. After you click on Finish, you will see that the new target is added to the list 
of targets: 


[3 Problems | Æl Console | 4f Remote Systems | #14 Targets X 
> 3) https://zf2cloudapp.my.phpcloud.com:10082 (Id: 0_0) 





What just happened? 


We have successfully created our first mobile application using Zend's cloud-connected 
mobile application projects. In the subsequent sections we will understand how to 
extend these web services using Zend Framework 2 to build additional functionality 


into mobile applications. 
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PhoneGap is a mobile application development framework which allows developers to build 
mobile applications using HTML, CSS, and JavaScript. The PhoneGap framework is used to 
convert these applications into native mobile applications, without having to rewrite the 
applications in native languages like Objective-C for iOS. 


Zend Studio 10 now integrates PhoneGap into the Zend Studio IDE; this enables developers 
to easily build and test mobile applications without having to depend on external libraries. 


For more information on cloud-connected mobile applications using Zend Studio 10; please 
refer the following documentation page: 


http://files.zend.com/help/Zend-Studio-10/zend-studio.htm#cloud_ 
connect mobile.htm 


Time for action — building your first cloud-connected mobile 


application 


Perform the following steps for building your first cloud-connected mobile application: 





1. Choose the Cloud Connected Mobile Project option from the New menu: 


Zend Studio | 3° Edit Refactor Source Navigate Search Project Run Window Help Zend Store 


8.9.8 New > a- Cloud Connected Mobile Project faul: 
fae Open File... að Web Services Project 
Close 4 PHP Project from Git 
Close All PHP Project from GitHub 
© PHP Project from OpenShift 
PHP Project from Zend Developer Cloud 
=” PHP Project from SVN 
E Local PHP Project 
E PHP Project from Existing Directory 
Move... E£ PHP Project from Remote Server 


Rename... Fi Project... 
®) Refresh 


Convert Line Delimiters To E? PHPUnit Test Case 
ES PHPUnit Test Suite 
Print... © Class 


Save 


Save As... 


Save All 


Revert 





2. Inthe Project wizard, you will be asked to provide the following details: 
a Mobile Project Name: Name of the client-side mobile application project 


a Web Services Project Name: Name of the web services project for the 
mobile application 


a Web Services Project Deployment Target: Deployment target for the mobile 
application (you can choose the previously created phpcloud target here) 
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d Zend Studio 10 supports various deployment options; it can 
` automatically detect local Zend Server installation or deploy an 
Q application to one of the targets— the local Zend Server, remote 
Zend Server, Zend Developer Cloud (phpCloud), or OpenShift Cloud. 


New Cloud Connected Mobile Project 


Create a Cloud Connected Mobile Project. 


Create a Cloud Connected Mobile Project. 


Mobile Project 





Name: 


al Create web services project 


Name: MyMobileService| 


Location: Use rs/krishna/Zend /workspaces/DefaultWorkspace | | 











Target: | https: //zf2cloudapp.my.phpcloud.com:10082 (Id: 1_0) + | | Add Target | 








o Next> ) (Cancel | G 
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3. Inthe template selection page, choose Simple Services as it will create a simple 
project with a client/server-side example as shown in the following screenshot: 


New Cloud Connected Mobile Project 


Templates 


Select a template to generate fully-functioning mobile and server projects. 


Available Templates: 





Empty Projects (Select this template to create a Web Mobile client 
Native APIs Example |- side project that contains examples of how to 
Simple Services (consume native mobile APIs in your mobile 
| | project, and a server side project containing 
Jexample implementation of Web services exposed 
ifor the mobile client - side project. 


(On server side, the project has a very simple API 
(with two example RPC services and one RESTful 
(service with a php handler class that implements 
storage and retrieval of customers from sqglite.db 
| file. 


(On client side, mobile application is built of two 
|screens, one with list of employees and the other 
with employee details such as employee name, 
|location, and phone number. Application fetches 
‘data from the server - side, but also has some 

| predefined sample static data to present when 
server - side doesn't work. 





Cancel 
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4. Clicking on Finish will create the mobile and web services projects. The user 
interface designer in the mobile project lets us easily make changes to the mobile 
interface as shown in the following screenshot: 


a0 8 PHP - MyMobdetpp!/ mobile appGul = fend Studio - (Wsers/krishna/fend/ work: paces /DeclaullWorktpace 
tee De Gis aie) tw pr Beer o % Ey PHP 


r DS 
FHP Explorer H = Fl) weicome Ll gateeay.aml B hy ioboetuon Lo mobinapptui EI -AD “ll eal = | 
| r E - i 





a Tij : | An outline it niet 
: Customers asilale 
F li Myto Aes 
E [E wa 

a config-ami 

È mobile sop Lil Cust 
P Let MyMobile seriet 
Customert 


Customer? + mè indor 
C idefaule Cray 
Chace... 


| KETAT- u Tu] Ko rga 
migā 
/messages’ epost 
Gamesi 1: 
Padhy 


ij 











Sa 

— 
© Probie El Censele E JA Rermote Sutera SE Targets 
Ne censales en divalay an rhis time 





5. Now run the project from the Zend Studio IDE; it should launch a Zend emulator 
interface as shown in the next screenshot: 


The Get List button should return the list of customers from the 
web services project via an RPC call. If the request doesn't return a 
response and throws an error such as Ajax error. Error: Access is 
= denied. Trying static data!, then check the gatewayURL variable in 
MobileApplication/www/js/my.js. 
Make sure it points to the correct deployment URL as follows: 


var gatewayURL = ‘http://zf2cloudapp.my.phpcloud. 
com/MobileService'; 
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Customers 


Jane 


Marc 


Frank 


Get List 





What just happened? 


We have successfully created our first mobile application using Zend's cloud-connected 
mobile application projects. In the subsequent sections we will understand how to 
extend these web services using Zend Framework 2 to build additional functionality 
into mobile applications. 


Native mobile applications provide great benefits over mobile web applications. Native web 
applications are run from the device memory, so there is little need for network interaction; 
these applications tend to load and run faster. One of the other key advantages of native 
mobile applications is that they have access to the device's native features such as camera, 
device information, and accelerometer; this gives native applications an added advantage 
over mobile web applications. 
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Time for action — testing as a native application 





In this task we will create a native iOS application using the Native Applications section of 
Zend Studio. Before you get started, make sure that Xcode IDE in installed on your Mac. 
Perform the following steps: 


For Android applications, you will need to have Android Development 
Q Tool (ADT) installed; this can be installed directly from Zend Studio. 


For a Windows phone application, the Windows Phone SDK needs to 
be installed. 


1. Now, from our mobile application project choose Create iOS Application: 


e090 _| PHP - MyMobileApp/config.xml - Zend Studio - /Users/krishna/Zend/workspaces/DefaultWorkspace 
Pir Hv Q- Q-~ ay R r 


HE PHP Explorer 23 m @ weicome $} gateway.xml 





© General 

(3 MyMobileApp 
www General Information Native Applications 

® config.xml 


Enter your application's properties. l AR 
TA mobile.appGUI ” pp prop : Select the mobile platform for your native application. 


Name ; 
EE MyMobileService MyMobileApp 


= 
f im! Create Android Application 
com.phonegap.example 


1.0.0 IOS Create iOS Application N 
e > 


© Create Windows Phone Application 


v APis 
Review a list of PhoneGap API features to be be inserted into your native 





2. You will be asked to provide the project details; please specify the Company Name 
and Bundle Id values. The Bundle Id value refers to the unique name that is used 
to identify the application; this is usually provided in the com.my-company-name. 
my-application-name format. When you register the application with the Apple 
Store, ensure that the bundle identifier matches with the one provided at Apple. 


EONS. New iOS Application 

Create an IOS Application : x ' 
Create an iOS Application. rT ) 
Project Name: MyMobileApp_ios 

Location: fUsers/krishna/Zend/workspaces/DefaultWorkspace 


Bundle Id: com.phonegap.example 


Company Name: My Company 


Cancel | Finish |] 
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3. Now the new iOS project is created in the workspace as you can see in the 
following screenshot: 


$+ Or Q:r | ¥ 


TAON = HĒ 


¥ [= MyMobileApp 


[> wa 
& config.xml 
[7 mobile.appGUI 
-È MyMobileApp ios 
b [= MyMobileService 





Zend Studio allows for the creation of multiple dependent mobile application 
projects. If you have to make any changes to the client code, the changes can 
be made in the parent mobile project and that will automatically update all 
dependent client projects. 


For more information on creating native applications, please refer to the Zend 
Studio documentation at the following link: 





http://files.zend.com/help/Zend-Studio-10/zend- 
studio.htm#creating native applications.htm 


4. Ifyou run the project, the application will launch the iOS emulator and will launch 


the mobile application as shown in the following screenshot: 
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Carrier => 11:39 PM Carrier = 11:37 PM 


Customers < Back Details 


Jane 


Jane Is currently walking in: 


Marc 


Frank 


Temple 


Get List 


Make a call 





What just happened? 


We have created a new native iOS application using Zend Studio support for a native 
application; in our next section we will be using Zend Framework 2 to provide web 
services for this application. 


Now that you have created an iOS native application, try creating an Android version 
of the same application using Zend Studio. For this, you will need to install the Android 
Development Tool on your Zend Studio installation. 
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Zend Server Gateway 


Zend Server Gateway is a lightweight web services gateway based on Zend Framework 2, 
which allows for the mapping of web service routes to various controller/actions of the web 
services. Zend Server Gateway is responsible for authentication, validation, filtering, and 
routing for RPC and RESTful APIs used in CCM projects. 


The routing configurations are mapped into config/gateway.xml1; the routes and 
configurations can be managed using the gateway editor interface provided in Zend Studio. 


Time for action — creating a mobile search interface 





In this task, we will be creating a simple search interface for searching the existing customer 
records by name using the following steps: 


1. We will need to create a search function in the CustomerRepository model 
(MyMobileService\src\MyCompany\Model\CustomerRepository. php): 


public function getSearch ($query) 


{ 
Swhere = new \Zend\Db\Sql\Where () ; 
Swhere->like('name', "SSquery%") ; 
return Sthis->customerTable->select (Swhere) ->toArray () ; 


} 


2. Adda new action in RpcController (MyMobileService\src\MyCompany \ 
Controller\RpcController.php); this will handle the web service request: 


public function getSearchCustomersAction (Squery) 


{ 


Scr = new CustomerRepository() ; 
return Scr->getSearch ($query); 


} 
3. Inthe gateway editor, create a new RPC service; set the following options: 
a URL: /search 
a Method: GET 
a Request Parameters(Add): Name — query; Source — Route 


a Handler Method: MyCompany\Controller\RpcController: :getSear 
chCustomersAction 
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4. You can test the RPC service by right-clicking on the service and choosing Test 
Service. On the right-hand side you will be presented with an interface to provide 
test input and validate the service response: 


|F] RpcController.php | G mobile.appGUl | my.js 


Fa 


Initialize ) 
Pi 


RPC RESTful 
GET / customers GET /hellof:na... fcustomer[/ id] 
s * 
Validation | 
mi 





-l 


Fai 
i 





5. Inthe mobile GUI editor, create a new page searchCustomers, and add the 
following elements: 


a Text Box: custsearchinput 
a Button: searchbutton 
a List View: custlistview 
6. Inthe binding section of the Search button, bind the button with the GET / 
search: query () web service. Map the custsearchinput textbox to the query 
route parameter in the data section. This action will bind the search text to the 


query route parameter. Note that the query route parameter is already mapped to 
getSearchCsutomerAction. 
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7. Modify the onGetSearchquery JavaScript method in MyMobileApp/www/js/ 
my . js to handle the RPC response: 


function onGetSearchquery (response) { 
// TODO Custom logic to handle server response 
customers = response; 


var newCustomers = ''; 
$.each(customers, function(index, item) { 
newCustomers += '<li data-theme=""35' 
+ '<a href="#page2?empiId=' + index 


+ '" data-transition="none">' + item.name + '</a>' + 
t2/ is" 3 

); 

S('#custlistview li[role!=heading]') .remove() ; 


S('#custlistview') .append(newCustomers) .listview('refresh') ; 


} 


8. Make sure that you link the Search page from the index page using a button. 


9. Now run the project in native mode; you will be able to see the search page, like the 
one shown in the following screenshot: 


Carrier > 11:42 PM ) Carrier > 11:43 PM 


Customers Search 


Jane 
Search 
Marc 


Frank 


Get List 


Search 
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What just happened? 


We have now created new web services for the existing cloud-connected mobile application 
and have tested the mobile app in a native emulator. With Zend Studio 10, you can see the 
simplicity in building mobile apps which are supported by web services running on the cloud. 





Q1. Which of the following platforms are supported in Zend Studio 10 for native mobile 
application development? 


1. Android 
2. Firefox OS 
3. MeeGo 

4. Brew 


Q2. Which of the following web services are not supported by Zend Server Gateway for 
building cloud-connected mobile applications? 


1. RPC 
2. SOAP 
3. REST 


Summary 


Cloud-connected mobile applications are a great step by Zend towards enabling PHP 
developers to build and support mobile apps using the cloud platform. With CCM, Zend is 
offering an extremely robust, yet simple-to-use platform for building these applications. 


Having completed this chapter, you have come to the end of this book. You have covered a 
lot of ground in various different applications of Zend Framework through this book and have 
accomplished a number of tasks. This book has shown you the building blocks for developing 
applications using Zend Framework 2; there is lot more to learn in Zend Framework, most of 
which is explained in an extremely detailed manner in the Zend Framework documentation 
(http: //framework.zend.com/manual/2.2/en/index.html1). 


Thanks for reading. Feel free to give your feedback on how you felt reading this book. 
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